Merge branch 'master' of http://cloud.finedevelop.com:2015/scm/~guy/fineui

# Conflicts:
#	bi/base.js
#	dist/demo.js

bi/base.js

@@ -3897,17 +3897,13 @@ BI.shortcut("bi.combo_group", BI.ComboGroup);BI.VirtualGroup = BI.inherit(BI.Wid
     },
 
     setValue: function (v) {
-        this.layouts.setValue(v);
+        // this.layouts.setValue(v);
     },
 
     getValue: function () {
         return this.layouts.getValue();
     },
 
-    empty: function () {
-        this.layouts.empty();
-    },
-
     populate: function (items) {
         var self = this;
         items = items || [];
@@ -16333,9 +16329,11 @@ BI.RichEditorParamAction = BI.inherit(BI.RichEditorAction, {
         var instance = o.editor.selectedInstance;
         var next = $param.next();
         if (next.length === 0 || this._isParam(next)) {
-            var node = this._createBlankNode();
+            var preNode = this._createBlankNode();
-            $param.after(node);
+            var nextNode = this._createBlankNode();
-            instance.setFocus(node[0]);
+            $param.before(preNode);
+            $param.after(nextNode);
+            instance.setFocus(nextNode[0]);
         } else {
             instance.setFocus(next[0]);
         }
@@ -16589,7 +16587,7 @@ BI.shortcut('bi.rich_editor_text_toolbar', BI.RichEditorTextToolbar);/**
         start: function () {
             this.elm.element.attr("contentEditable", true);
             if (this.getContent() == "") {
-                this.setContent("<br />");
+                // this.setContent("<br />");
             }
             this.instanceDoc = document.defaultView;
             this.elm.element.on('mousedown', BI.bind(this.selected, this));

bi/core.js

@@ -1182,9 +1182,6 @@ BI.Factory = {
         // manipulation API.
         _removeElement: function () {
             this.$el.remove();
-            if ($.browser.msie === true) {
-                this.el.outerHTML = '';
-            }
         },
 
         // Change the view's element (`this.el` property) and re-delegate the
@@ -1225,7 +1222,7 @@ BI.Factory = {
         // alternative DOM manipulation API and are only required to set the
         // `this.el` property.
         _setElement: function (el) {
-            this.$el = el instanceof BI.$ ? el : BI.$(el);
+            this.$el = el instanceof BI.$ ? el : (BI.isWidget(el) ? el.element : BI.$(el));
             this.element = this.$el;
             this.el = this.$el[0];
         },
@@ -1636,8 +1633,8 @@ BI.Factory = {
 
             // Add a cross-platform `addEventListener` shim for older browsers.
             var addEventListener = window.addEventListener || function (eventName, listener) {
-                    return attachEvent('on' + eventName, listener);
+                return attachEvent('on' + eventName, listener);
-                };
+            };
 
             // Depending on whether we're using pushState or hashes, and whether
             // 'onhashchange' is supported, determine how we check the URL state.
@@ -1657,8 +1654,8 @@ BI.Factory = {
         stop: function () {
             // Add a cross-platform `removeEventListener` shim for older browsers.
             var removeEventListener = window.removeEventListener || function (eventName, listener) {
-                    return detachEvent('on' + eventName, listener);
+                return detachEvent('on' + eventName, listener);
-                };
+            };
 
             // Remove window listeners.
             if (this._hasPushState) {
@@ -4804,7 +4801,7 @@ BI.Widget = BI.inherit(BI.OB, {
     __d: function () {
         this.beforeDestroy && this.beforeDestroy();
         BI.each(this._children, function (i, widget) {
-            widget._unMount && widget._unMount();
+            widget && widget._unMount && widget._unMount();
         });
         this._children = {};
         this._parent = null;
@@ -4827,7 +4824,7 @@ BI.Widget = BI.inherit(BI.OB, {
 
     empty: function () {
         BI.each(this._children, function (i, widget) {
-            widget._unMount && widget._unMount();
+            widget && widget._unMount && widget._unMount();
         });
         this._children = {};
         this.element.empty();
@@ -5547,8 +5544,8 @@ BI.View = BI.inherit(BI.V, {
         return this;
     },
 
-    createView: function (url, modelData, viewData) {
+    createView: function (url, modelData, viewData, context) {
-        return BI.Factory.createView(url, this.get(url), modelData, viewData);
+        return BI.Factory.createView(url, this.get(url), modelData, viewData, context);
     },
 
     /**
@@ -5586,7 +5583,7 @@ BI.View = BI.inherit(BI.V, {
         }
         cardLayout.setVisible(true);
         if (BI.isKey(cardName) && !cardLayout.isCardExisted(cardName)) {
-            var view = this.createView(this.rootURL + "/" + cardName, data, viewData);
+            var view = this.createView(this.rootURL + "/" + cardName, data, viewData, this);
             isValid && this.model.addChild(modelData, view.model);
             view.listenTo(view.model, "destroy", function () {
                 delete self._cards[cardName];
@@ -5712,6 +5709,7 @@ BI.View = BI.inherit(BI.V, {
                 success && success(data, model);
             }
         }));
+
         function callback(data) {
             self.model.load(data);
             self.load(data);
@@ -5889,7 +5887,14 @@ BI.View = BI.inherit(BI.V, {
         this.trigger(BI.Events.DESTROY);
         this.off();
     }
-});(function () {
+});
+
+BI.View.registerVMRouter = function (viewRouter, modelRouter) {
+    //配置View
+    BI.View.createView = BI.View.prototype.createView = function (url, modelData, viewData, context) {
+        return BI.Factory.createView(url, viewRouter.get(url), _.extend({}, modelRouter.get(url), modelData), viewData || {}, context);
+    };
+};(function () {
     var kv = {};
     BI.shortcut = function (xtype, cls) {
         if (kv[xtype] != null) {
@@ -5904,8 +5909,7 @@ BI.View = BI.inherit(BI.V, {
             return new (new Function('return ' + config['classType'] + ';')())(config);
         }
 
-        var xtype = config.type.toLowerCase();
+        var cls = kv[config.type];
-        var cls = kv[xtype];
         return new cls(config);
     };
 
@@ -10504,7 +10508,7 @@ $.extend(BI, {
             }
             child.setParent(this);
             if (cur >= 0) {
-                this.getChild(cur).setRight(child);
+                this.getChild(cur) && this.getChild(cur).setRight(child);
                 child.setLeft(this.getChild(cur));
             }
             if (BI.isUndefined(index)) {
@@ -11527,31 +11531,161 @@ BI.Layout = BI.inherit(BI.Widget, {
         })
     },
 
-    update: function (item) {
+    patchItem: function (oldVnode, vnode, index) {
-        var o = this.options;
+        if (!this._compare(oldVnode, vnode)) {
-        var items = item.items || [];
+            return this.updateItemAt(index, vnode);
-        var updated, i, len;
+        }
-        for (i = 0, len = Math.min(o.items.length, items.length); i < len; i++) {
+    },
-            if (!this._compare(o.items[i], items[i])) {
+
-                updated = this.updateItemAt(i, items[i]) || updated;
+    updateChildren: function (oldCh, newCh) {
-            }
+        var self = this;
-        }
+        var oldStartIdx = 0, newStartIdx = 0;
-        if (o.items.length > items.length) {
+        var oldEndIdx = oldCh.length - 1;
-            var deleted = [];
+        var oldStartVnode = oldCh[0];
-            for (i = items.length; i < o.items.length; i++) {
+        var oldEndVnode = oldCh[oldEndIdx];
-                deleted.push(this._children[this._getChildName(i)]);
+        var newEndIdx = newCh.length - 1;
-                delete this._children[this._getChildName(i)];
+        var newStartVnode = newCh[0];
-            }
+        var newEndVnode = newCh[newEndIdx];
-            o.items.splice(items.length);
+        var before;
-            BI.each(deleted, function (i, w) {
+        var updated;
-                w._destroy();
+        var children = {};
-            })
+        BI.each(oldCh, function (i, child) {
-        } else if (items.length > o.items.length) {
+            child = self._getOptions(child);
-            for (i = o.items.length; i < items.length; i++) {
+            var key = child.key == null ? i : child.key;
-                this.addItemAt(i, items[i]);
+            if (BI.isKey(key)) {
+                children[key] = self._children[self._getChildName(i)];
+            }
+        });
+
+        while (oldStartIdx <= oldEndIdx && newStartIdx <= newEndIdx) {
+            if (BI.isNull(oldStartVnode)) {
+                oldStartVnode = oldCh[++oldStartIdx];
+            } else if (BI.isNull(oldEndVnode)) {
+                oldEndVnode = oldCh[--oldEndIdx];
+            } else if (sameVnode(oldStartVnode, newStartVnode, oldStartIdx, newStartIdx)) {
+                updated = this.patchItem(oldStartVnode, newStartVnode, oldStartIdx) || updated;
+                oldStartVnode = oldCh[++oldStartIdx];
+                newStartVnode = newCh[++newStartIdx];
+            } else if (sameVnode(oldEndVnode, newEndVnode, oldEndIdx, newEndIdx)) {
+                updated = this.patchItem(oldEndVnode, newEndVnode, oldEndIdx) || updated;
+                oldEndVnode = oldCh[--oldEndIdx];
+                newEndVnode = newCh[--newEndIdx];
+            } else if (sameVnode(oldStartVnode, newEndVnode)) {
+                updated = this.patchItem(oldStartVnode, newEndVnode, oldStartIdx) || updated;
+                insertBefore(oldStartVnode, oldEndVnode, true);
+                oldStartVnode = oldCh[++oldStartIdx];
+                newEndVnode = newCh[--newEndIdx];
+            } else if (sameVnode(oldEndVnode, newStartVnode)) {
+                updated = this.patchItem(oldEndVnode, newStartVnode, oldEndIdx) || updated;
+                insertBefore(oldEndVnode, oldStartVnode);
+                oldEndVnode = oldCh[--oldEndIdx];
+                newStartVnode = newCh[++newStartIdx];
+            } else {
+                var node = addNode(newStartVnode);
+                insertBefore(node, oldStartVnode);
+                newStartVnode = newCh[++newStartIdx];
+            }
+        }
+        if (oldStartIdx > oldEndIdx) {
+            before = BI.isNull(newCh[newEndIdx + 1]) ? null : newCh[newEndIdx + 1].elm;
+            addVnodes(before, newCh, newStartIdx, newEndIdx);
+        } else if (newStartIdx > newEndIdx) {
+            removeVnodes(oldCh, oldStartIdx, oldEndIdx);
+        }
+
+        this._children = {};
+        BI.each(newCh, function (i, child) {
+            var node = self._getOptions(child);
+            var key = node.key == null ? i : node.key;
+            children[key]._mount();
+            self._children[self._getChildName(i)] = children[key];
+        });
+
+        function sameVnode(vnode1, vnode2, oldIndex, newIndex) {
+            vnode1 = self._getOptions(vnode1);
+            vnode2 = self._getOptions(vnode2);
+            if (BI.isKey(vnode1.key)) {
+                return vnode1.key === vnode2.key;
+            }
+            if (oldIndex >= 0) {
+                return oldIndex === newIndex
+            }
+        }
+
+        function addNode(vnode, index) {
+            var opt = self._getOptions(vnode);
+            var key = opt.key == null ? index : opt.key;
+            return children[key] = self._addElement(key, vnode);
+        }
+
+        function addVnodes(before, vnodes, startIdx, endIdx) {
+            for (; startIdx <= endIdx; ++startIdx) {
+                var node = addNode(vnodes[startIdx], startIdx);
+                insertBefore(node, before, false, startIdx);
             }
         }
+
+        function removeVnodes(vnodes, startIdx, endIdx) {
+            for (; startIdx <= endIdx; ++startIdx) {
+                var node = self._getOptions(vnodes[startIdx]);
+                var key = node.key == null ? startIdx : node.key;
+                children[key]._destroy();
+            }
+        }
+
+        function insertBefore(insert, before, isNext, index) {
+            insert = self._getOptions(insert);
+            before = before && self._getOptions(before);
+            var insertKey = BI.isKey(insert.key) ? insert.key : index;
+            if (before && children[before.key]) {
+                var beforeKey = BI.isKey(before.key) ? before.key : index;
+                var next;
+                if (isNext) {
+                    next = children[beforeKey].element.next();
+                } else {
+                    next = children[beforeKey].element;
+                }
+                if (next.length > 0) {
+                    next.before(children[insertKey].element);
+                } else {
+                    self._getWrapper().append(children[insertKey].element);
+                }
+            } else {
+                self._getWrapper().append(children[insertKey].element);
+            }
+        }
+
+        return updated;
+    },
+
+    update: function (opt) {
+        var o = this.options;
+        var items = opt.items || [];
+        var updated = this.updateChildren(o.items, items);
+        this.options.items = items;
         return updated;
+        // var updated, i, len;
+        // for (i = 0, len = Math.min(o.items.length, items.length); i < len; i++) {
+        //     if (!this._compare(o.items[i], items[i])) {
+        //         updated = this.updateItemAt(i, items[i]) || updated;
+        //     }
+        // }
+        // if (o.items.length > items.length) {
+        //     var deleted = [];
+        //     for (i = items.length; i < o.items.length; i++) {
+        //         deleted.push(this._children[this._getChildName(i)]);
+        //         delete this._children[this._getChildName(i)];
+        //     }
+        //     o.items.splice(items.length);
+        //     BI.each(deleted, function (i, w) {
+        //         w._destroy();
+        //     })
+        // } else if (items.length > o.items.length) {
+        //     for (i = o.items.length; i < items.length; i++) {
+        //         this.addItemAt(i, items[i]);
+        //     }
+        // }
+        // return updated;
     },
 
     stroke: function (items) {
@@ -13881,7 +14015,7 @@ BI.HorizontalLayout = BI.inherit(BI.Layout, {
     props: function () {
         return BI.extend(BI.HorizontalLayout.superclass.props.apply(this, arguments), {
             baseCls: "bi-horizontal-layout",
-            verticalAlign: "middle",
+            verticalAlign: BI.VerticalAlign.Top,
             columnSize: [],
             scrollx: true,
             hgap: 0,
@@ -16855,7 +16989,25 @@ BI.extend(jQuery, {
  */
 BI.Func = {};
 BI.extend(BI.Func, {
-
+    /**
+     * 创建唯一的名字
+     * @param array
+     * @param name
+     * @returns {*}
+     */
+    createDistinctName: function (array, name) {
+        var src = name, idx = 1;
+        name = name || "";
+        while (true) {
+            if (BI.every(array, function (i, item) {
+                    return item.name !== name;
+                })) {
+                break;
+            }
+            name = src + (idx++);
+        }
+        return name;
+    },
     /**
      * 获取搜索结果
      * @param items

bi/sliders.js

@@ -1451,6 +1451,7 @@ BI.SingleSlider = BI.inherit(BI.Widget, {
         this.min = 0;
         this.max = 0;
         this._setBlueTrack(0);
+        
     },
 
     populate: function () {
@@ -1485,7 +1486,7 @@ BI.SingleSliderLabel = BI.inherit(BI.Widget, {
     _defaultConfig: function () {
         return BI.extend(BI.SingleSliderLabel.superclass._defaultConfig.apply(this, arguments), {
             baseCls: "bi-single-slider-label bi-slider-track",
-            digit: "",
+            digit: false,
             unit: ""
         });
     },
@@ -1493,7 +1494,6 @@ BI.SingleSliderLabel = BI.inherit(BI.Widget, {
         BI.SingleSliderLabel.superclass._init.apply(this, arguments);
 
         var self = this, o = this.options;
-        var digitExist = (o.digit === "") ? false : true;
         var c = this._constant;
         this.enable = false;
         this.value = "";
@@ -1523,7 +1523,7 @@ BI.SingleSliderLabel = BI.inherit(BI.Widget, {
                 self._setBlueTrack(significantPercent);
                 self._setLabelPosition(significantPercent);
                 var v = self._getValueByPercent(significantPercent);
-                v = digitExist ? v.toFixed(o.digit) : v;
+                v = o.digit === false ? v : v.toFixed(o.digit);
                 self.label.setText(v + o.unit);
                 self.value = v;
                 self.fireEvent(BI.SingleSliderLabel.EVENT_CHANGE);
@@ -1561,7 +1561,7 @@ BI.SingleSliderLabel = BI.inherit(BI.Widget, {
                 var significantPercent = BI.parseFloat(percent.toFixed(1));
                 self._setAllPosition(significantPercent);
                 var v = self._getValueByPercent(significantPercent);
-                v = digitExist ? v.toFixed(o.digit) : v;
+                v = o.digit === false ? v : v.toFixed(o.digit);
                 self.label.setText(v + o.unit);
                 self.value = v;
                 self.fireEvent(BI.SingleSliderLabel.EVENT_CHANGE);
@@ -1692,17 +1692,16 @@ BI.SingleSliderLabel = BI.inherit(BI.Widget, {
 
     setValue: function (v) {
         var o = this.options;
-        var digitExist = (o.digit === "") ? false : true;
+        v = BI.parseFloat(v);
-        var value = BI.parseFloat(v);
+        v = o.digit === false ? v : v.toFixed(o.digit);
-        value = digitExist ? value.toFixed(o.digit) : value;
+        if ((!isNaN(v))) {
-        if ((!isNaN(value))) {
+            if (this._checkValidation(v)) {
-            if (this._checkValidation(value)) {
+                this.value = v;
-                this.value = value;
             }
-            if (value > this.max) {
+            if (v > this.max) {
                 this.value = this.max;
             }
-            if (value < this.min) {
+            if (v < this.min) {
                 this.value = this.min;
             }
         }
@@ -1862,7 +1861,7 @@ BI.SingleSliderNormal = BI.inherit(BI.Widget, {
         });
         this.blueTrack = BI.createWidget({
             type: "bi.layout",
-            cls: "blue-track",
+            cls: "blue-track bi-high-light-background",
             height: 6
         });
         if (this.options.color) {

bi/widget.js

@@ -5932,9 +5932,9 @@ BI.MonthTrigger = BI.inherit(BI.Trigger, {
             this.editor.setTitle(v + 1);
             return;
         }
-        this.editor.setState();
+        this.editor.setState("");
-        this.editor.setValue();
+        this.editor.setValue("");
-        this.editor.setTitle();
+        this.editor.setTitle("");
     },
     getKey: function () {
         return this.editor.getValue() | 0;
@@ -10041,9 +10041,11 @@ BI.MultiSelectList = BI.inherit(BI.Widget, {
             cls: "popup-multi-select-list bi-border-left bi-border-right bi-border-bottom",
             itemsCreator: o.itemsCreator,
             valueFormatter: o.valueFormatter,
+            logic: {
+                dynamic: false
+            },
             // onLoaded: o.onLoaded,
             el: {
-                height: ""
             }
         });
         this.adapter.on(BI.MultiSelectLoader.EVENT_CHANGE, function () {
@@ -13385,6 +13387,7 @@ BI.QuarterTrigger = BI.inherit(BI.Trigger, {
     },
 
     setValue: function (v) {
+        v = v || "";
         this.editor.setState(v);
         this.editor.setValue(v);
         this.editor.setTitle(v);
@@ -16022,7 +16025,7 @@ BI.YearCombo = BI.inherit(BI.Widget, {
     },
 
     setValue: function (v) {
-        this.combo.setValue(v);
+        this.combo.setValue(v || "");
     },
 
     getValue: function () {

demo/config.js

@@ -1,4 +1,4 @@
-Demo.CONFIG = Demo.CORE_CONFIG.concat(Demo.BASE_CONFIG).concat(Demo.CASE_CONFIG).concat(Demo.WIDGET_CONFIG).concat(Demo.COMPONENT_CONFIG).concat(Demo.ADDONS_CONFIG).concat(Demo.CATEGORY_CONFIG);
+Demo.CONFIG = Demo.CORE_CONFIG.concat(Demo.BASE_CONFIG).concat(Demo.CASE_CONFIG).concat(Demo.WIDGET_CONFIG).concat(Demo.COMPONENT_CONFIG).concat(Demo.VM_CONFIG).concat(Demo.ADDONS_CONFIG).concat(Demo.CATEGORY_CONFIG);
 
 Demo.CONSTANTS = {
     SIMPLE_ITEMS: BI.map("柳州市城贸金属材料有限责任公司 柳州市建福房屋租赁有限公司 柳州市迅昌数码办公设备有限责任公司 柳州市河海贸易有限责任公司 柳州市花篮制衣厂 柳州市兴溪物资有限公司 柳州市针织总厂 柳州市衡管物资有限公司 柳州市琪成机电设备有限公司 柳州市松林工程机械修理厂".match(/[^\s]+/g), function (i, v) {

demo/css/vm.css

@@ -0,0 +1,102 @@
+.mvc-button:hover,
+.mvc-button.hover {
+  opacity: 0.5;
+  filter: alpha(opacity=50);
+}
+.mvc-button.active,
+.mvc-button:active {
+  opacity: 0.5;
+  filter: alpha(opacity=50);
+}
+.bi-set-get .left-title,
+.bi-set-get .right-title {
+  background: #0088cc;
+  color: #ffffff;
+}
+.bi-set-get .left-nav {
+  border-bottom: 1px solid #cccccc;
+}
+.bi-set-get .left-nav.active,
+.bi-set-get .left-nav:active {
+  color: #ffffff;
+  background-color: #d9534f;
+}
+.bi-local .top-button {
+  background-color: #448eea;
+  color: #ffffff;
+}
+.bi-local .bottom-label {
+  background-color: #EA4738;
+  color: #ffffff;
+}
+.bi-local .delete-button {
+  background-color: #008B8B;
+  color: #ffffff;
+}
+.bi-local .vessel-border {
+  border-left: 1px solid #cccccc;
+  border-bottom: 1px solid #cccccc;
+  border-right: 1px solid #cccccc;
+}
+.bi-event .title {
+  background: #0088cc;
+  color: #ffffff;
+}
+.bi-event .front {
+  background: #ADD8E6;
+}
+.bi-event .nav {
+  border: 1px solid #cccccc;
+}
+.bi-skip-to {
+  color: #ffffff;
+}
+.bi-skip-to .red-pane {
+  background-color: #0088cc;
+}
+.bi-skip-to .blue-pane {
+  background-color: #6495ED;
+}
+.bi-skip-to .green-pane {
+  background-color: #008B8B;
+}
+.bi-skip-to .yellow-pane {
+  background-color: #B8860B;
+}
+.bi-change .outer-text {
+  background-color: #0088cc;
+  color: #ffffff;
+}
+.bi-change .inner {
+  border-left: 1px solid #cccccc;
+  border-bottom: 1px solid #cccccc;
+  border-right: 1px solid #cccccc;
+}
+.bi-change .type-first {
+  background-color: #008B8B;
+}
+.bi-change .type-second {
+  background-color: #6495ED;
+}
+.bi-change .type-third {
+  background-color: #0088cc;
+}
+.bi-tmp .tmp-button {
+  color: #ffffff;
+  background: #0088cc;
+}
+.bi-splice-duplicate .superiors-label {
+  color: white;
+  background-color: #008B8B;
+}
+.bi-splice-duplicate .sd-child {
+  border: 1px solid #cccccc;
+}
+.bi-splice-duplicate .sd-child .right-button-add {
+  color: white;
+  background-color: #0088cc;
+}
+.bi-splice-duplicate .sd-child .right-button-del {
+  color: white;
+  background-color: #d9534f;
+}

demo/js/category/sortTree/demo.sortTree.js

@@ -0,0 +1,136 @@
+Demo.Expander = BI.inherit(BI.Widget, {
+    render: function () {
+        var self = this, o = this.options;
+        return {
+            type: "bi.expander",
+            ref: function () {
+                self.expander = this;
+            },
+            el: o.el,
+            popup: o.popup
+        }
+    },
+
+    update: function (opt) {
+        this.expander.populate(opt.items);
+        return true;
+    }
+});
+BI.shortcut("demo.sort_tree_expander", Demo.Expander)
+
+/**
+ * guy
+ * 二级树
+ * @class Demo.SortTree
+ * @extends BI.Widget
+ */
+Demo.SortTree = BI.inherit(BI.Widget, {
+
+    render: function () {
+        var self = this, o = this.options;
+        var tree = new BI.Tree();
+        tree.initTree(BI.Tree.transformToTreeFormat(Demo.CONSTANTS.TREEITEMS));
+        this.tree = BI.createWidget({
+            type: "bi.custom_tree",
+            element: this,
+            expander: {
+                type: "demo.sort_tree_expander"
+            },
+
+            items: this._formatItems(0, tree.toJSON()),
+
+            el: {
+                type: "bi.virtual_group",
+                layouts: [{
+                    type: "bi.vertical",
+                    scrolly: false
+                }]
+            }
+        });
+
+        this.tree.element.sortable({
+            items: ".sort-item",
+            placeholder: {
+                element: function ($currentItem) {
+                    var holder = BI.createWidget({
+                        type: "bi.layout",
+                        cls: "bi-sortable-holder",
+                        height: $currentItem.outerHeight()
+                    });
+                    holder.element.css({
+                        "margin-left": $currentItem.css("margin-left"),
+                        "margin-right": $currentItem.css("margin-right"),
+                        "margin-top": $currentItem.css("margin-top"),
+                        "margin-bottom": $currentItem.css("margin-bottom"),
+                        "margin": $currentItem.css("margin")
+                    });
+                    return holder.element;
+                },
+                update: function () {
+
+                }
+            },
+            update: function (event, ui) {
+                var node = ui.item.data("node");
+                var findTheNode = tree.search(node.id);
+                //这里简单处理下找到它的父节点
+                var currentIndex = 0, parentNode;
+                if (ui.item.next().length > 0) {
+                    var n = ui.item.next().data("node");
+                    var nextId = n.id;
+                    var nextNode = tree.search(nextId)
+                    parentNode = nextNode.getParent();
+                    var nextIndex = parentNode.getChildIndex(nextId);
+                    currentIndex = nextIndex > 0 && (nextIndex - 1);
+
+                } else if (ui.item.prev().length > 0) {
+                    var n = ui.item.prev().data("node");
+                    var prevId = n.id;
+                    var prevNode = tree.search(prevId)
+                    parentNode = prevNode.getParent();
+                    var prevIndex = parentNode.getChildIndex(prevId);
+                    currentIndex = prevIndex + 1;
+                }
+                findTheNode.getParent().removeChild(node.id);
+                parentNode.addChild(findTheNode, currentIndex);
+                console.log(tree.toJSON());
+                self.tree.populate(self._formatItems(0, tree.toJSON()));
+            },
+            start: function (event, ui) {
+
+            },
+            stop: function (event, ui) {
+            },
+            over: function (event, ui) {
+
+            }
+        });
+    },
+
+    _formatItems: function (layer, nodes) {
+        var self = this;
+        BI.each(nodes, function (i, node) {
+            if (node.isParent === true || BI.isNotEmptyArray(node.children)) {
+                BI.defaults(node, {
+                    type: "bi.multilayer_icon_arrow_node",
+                    height: 30,
+                    layer: layer
+                });
+                self._formatItems(layer + 1, node.children);
+            } else {
+                BI.defaults(node, {
+                    type: "bi.multilayer_icon_tree_leaf_item",
+                    cls: "sort-item",
+                    height: 30,
+                    key: node.id,
+                    layer: layer,
+                    data: {
+                        node: node
+                    }
+                });
+            }
+        });
+        return nodes;
+    },
+});
+BI.shortcut("demo.sort_tree", Demo.SortTree);

demo/js/config/addons.js

@@ -1,17 +1,17 @@
 Demo.ADDONS_CONFIG = [{
-    id: 6,
+    id: 7,
     text: "addons"
 }, {
-    pId: 6,
+    pId: 7,
-    id: 601,
+    id: 701,
     text: "拓展图表控件"
 }, {
-    pId: 601,
+    pId: 701,
     text: "柱状图",
     value: "demo.axis_chart"
 }, {
-    pId: 6,
+    pId: 7,
-    id: 602,
+    id: 702,
     text: "滚动sliders",
     value: "demo.slider"
 }];

demo/js/config/category.js

@@ -9,4 +9,8 @@ Demo.CATEGORY_CONFIG = [{
     pId: 100000,
     text: "大表格",
     value: "demo.large_table"
+}, {
+    pId: 100000,
+    text: "可以排序的树",
+    value: "demo.sort_tree"
 }];

demo/js/config/vm.js

@@ -0,0 +1,83 @@
+//定义Model路由
+var modelRouter = new (BI.inherit(BI.WRouter, {
+    routes: {
+        "": "index"
+    },
+
+    index: function () {
+        return {};
+    }
+}));
+//定义View路由
+var viewRouter = new (BI.inherit(BI.WRouter, {
+    routes: {
+        "": "TestView",
+        "/setget": "SetGetView",
+        "/local": "LocalView",
+        "/skipTo": "SkipToView",
+        "/skipTo/:child": "getSkipToView",
+        "/change": "ChangeView",
+        "/change/inner": "ChangeInnerView",
+        "/static": "StaticView",
+        "/event": "EventView",
+        "/layer": "LayerView",
+        "/masker": "MaskerView",
+        "/floatbox": "FloatBoxView",
+
+        "/spliceDuplicate": "SpliceDuplicateView",
+        "/spliceDuplicate/sdSub": "SDSubView",
+
+        "/tmp": "TmpView",
+        "/tmp/child": "TmpChildView",
+        "/tmp/child/child": "TmpChildChildView",
+    },
+
+    getSkipToView: function (v) {
+        switch (v) {
+            case "red":
+                return "SkipToRedView";
+            case "blue":
+                return "SkipToBlueView";
+            case "green":
+                return "SkipToGreenView";
+            case "yellow":
+                return "SkipToYellowView";
+            default :
+                return "SkipToRedView";
+        }
+
+    }
+}));
+
+//注册路由
+BI.View.registerVMRouter(viewRouter, modelRouter);
+
+
+Demo.VM_CONFIG = [{
+    id: 6,
+    text: "数据流框架"
+}, {
+    pId: 6,
+    text: "set,get方法",
+    value: "demo.setget"
+}, {
+    pId: 6,
+    text: "local函数",
+    value: "demo.local"
+}, {
+    pId: 6,
+    text: "skipTo函数",
+    value: "demo.skipTo"
+}, {
+    pId: 6,
+    text: "change函数",
+    value: "demo.change"
+}, {
+    pId: 6,
+    text: "splice和duplicate函数",
+    value: "demo.spliceDuplicate"
+}, {
+    pId: 6,
+    text: "tmp方法",
+    value: "demo.tmp"
+}];

demo/js/config/widget.js

@@ -214,6 +214,10 @@ Demo.WIDGET_CONFIG = [{
     pId: 4,
     id: 417,
     text: "布局"
+}, {
+    pId: 417,
+    text: "bi.arrangement",
+    value: "demo.arrangement"
 }, {
     pId: 417,
     text: "bi.adaptive_arrangement",

demo/js/core/abstract/demo.virtual_group.js

@@ -4,39 +4,65 @@ Demo.Func = BI.inherit(BI.Widget, {
     },
 
     _createItems: function () {
-        var items = BI.makeArray(100, {
+        var items = BI.map(BI.range(1000), function (i) {
-            type: "demo.virtual_group_item"
+            return {
+                type: "demo.virtual_group_item",
+                value: i,
+                key: i + 1
+            }
         });
-        items[0].value = BI.UUID();
         return items;
     },
 
     render: function () {
         var self = this;
+        var buttonGroupItems = self._createItems();
+        var virtualGroupItems = self._createItems();
         return {
             type: "bi.vertical",
             vgap: 20,
             items: [{
+                type: "bi.label",
+                cls: "layout-bg5",
+                height: 50,
+                text: "共1000个元素,演示button_group和virtual_group每次删除第一个元素,打开控制台看输出"
+            }, {
+                type: "bi.button_group",
+                width: 500,
+                height: 300,
+                ref: function () {
+                    self.buttonGroup = this;
+                },
+                chooseType: BI.ButtonGroup.CHOOSE_TYPE_MULTI,
+                layouts: [{
+                    type: "bi.vertical"
+                }],
+                items: this._createItems()
+            }, {
+                type: "bi.button",
+                text: "演示button_group的刷新",
+                handler: function () {
+                    buttonGroupItems.shift();
+                    self.buttonGroup.populate(BI.deepClone(buttonGroupItems));
+                }
+            }, {
                 type: "bi.virtual_group",
                 width: 500,
                 height: 300,
                 ref: function () {
-                    self.buttonMap = this;
+                    self.virtualGroup = this;
                 },
                 chooseType: BI.ButtonGroup.CHOOSE_TYPE_MULTI,
                 layouts: [{
                     type: "bi.vertical"
-                }, {
-                    type: "bi.center_adapt",
                 }],
                 items: this._createItems()
             }, {
                 type: "bi.button",
-                text: "点击刷新",
+                text: "演示virtual_group的刷新",
                 handler: function () {
-                    var items = self._createItems();
+                    virtualGroupItems.shift();
-                    items.pop();
+                    self.virtualGroup.populate(BI.deepClone(virtualGroupItems));
-                    self.buttonMap.populate(items);
                 }
             }]
 
@@ -52,21 +78,21 @@ Demo.Item = BI.inherit(BI.Widget, {
     },
 
     render: function () {
-        var self = this;
+        var self = this, o = this.options;
         return {
             type: "bi.label",
             ref: function () {
                 self.label = this;
             },
             height: this.options.height,
-            text: "这是一个测试项" + BI.UUID()
+            text: "key:" + o.key + ",随机数" + BI.UUID()
         }
     },
 
     update: function (item) {
         this.label.setText(item.value);
         console.log("更新了一项");
-        return true;
+        return true;//返回是不是更新成功
     },
 
     created: function () {

demo/js/core/layout/demo.horizontal.js

@@ -10,14 +10,27 @@ Demo.Horizontal = BI.inherit(BI.Widget, {
             type: "bi.horizontal",
             items: [{
                 type: "bi.label",
-                text: "水平布局",
+                whiteSpace: "normal",
+                text: "因为大多数场景下都需要垂直居中，所以这个布局一般会被vertical_adapt布局设置scrollx=true取代",
                 cls: "layout-bg3",
+                width: 500,
+                height: 50
+            }, {
+                type: "bi.label",
+                text: "水平布局",
+                cls: "layout-bg4",
                 width: 300,
                 height: 30
             }, {
                 type: "bi.label",
                 text: "水平布局",
-                cls: "layout-bg4",
+                cls: "layout-bg5",
+                width: 300,
+                height: 30
+            }, {
+                type: "bi.label",
+                text: "水平布局",
+                cls: "layout-bg6",
                 width: 300,
                 height: 30
             }]

demo/js/vm/change.js

@@ -0,0 +1,195 @@
+//change函数
+ChangeView = BI.inherit(BI.View, {
+    _defaultConfig: function(){
+        return BI.extend(ChangeView.superclass._defaultConfig.apply(this, arguments),{
+            baseCls: "bi-change"
+        })
+    },
+
+    _init: function(){
+        ChangeView.superclass._init.apply(this, arguments);
+    },
+
+    change: function(changed){
+        if(changed.child){
+            this._showModelData();
+        }
+        if(changed.superiors){
+            this._showModelData();
+        }
+    },
+
+    _showModelData: function(){
+        this.outerText.setText("父级Model层数据: " + JSON.stringify(this.model.toJSON()));
+    },
+
+    _createOuter: function(){
+        this.outerText = BI.createWidget({
+            type: "bi.label",
+            cls: "outer-text",
+            whiteSpace: "normal"
+        });
+
+        return BI.createWidget({
+            type: "bi.border",
+            items: {
+                north: {
+                    el: this.outerText,
+                    height: 50
+                },
+                center: this._createInner()
+            }
+        });
+    },
+
+    _createInner: function(){
+        var innerPane = BI.createWidget({
+            type: "bi.absolute",
+            cls: "inner"
+        });
+        this.addSubVessel("innerPane", innerPane, {
+            defaultShowName: "inner"
+        });
+        return innerPane;
+    },
+
+    render: function(vessel){
+        BI.createWidget({
+            type: "bi.center",
+            element: vessel,
+            items: [this._createOuter()],
+            hgap: 100,
+            vgap: 100
+        });
+
+        this._showModelData();
+    },
+
+    refresh: function(){
+        this.skipTo("inner", "innerPane", "superiors");
+    }
+});
+
+ChangeModel = BI.inherit(BI.Model, {
+    _defaultConfig: function(){
+        return BI.extend(ChangeModel.superclass._defaultConfig.apply(this, arguments),{
+            superiors: {
+                child: "default"
+            },
+            child: "default"
+        })
+    },
+
+    _init: function(){
+        ChangeModel.superclass._init.apply(this, arguments);
+    },
+
+    change: function(changed){
+        if(changed.superiors){
+            this.set("child", changed.superiors.child);
+        }
+    }
+});
+
+//ChangeView 的子级
+ChangeInnerView = BI.inherit(BI.View, {
+    _init: function(){
+        ChangeInnerView.superclass._init.apply(this, arguments);
+    },
+
+    change: function(changed){
+        if(changed.child){
+            this._showModelData();
+        }
+    },
+
+    _createOuter: function(){
+        var self = this;
+        this.text = BI.createWidget({
+            type: "bi.label",
+            height: 26
+        });
+
+        this.buttons = BI.createWidget({
+            type: "bi.button_group",
+            items: BI.createItems(this.model.get("items"), {
+                type: "bi.text_button",
+                height: 30,
+                textAlign: "center",
+                hgap: 20
+            })
+        });
+
+        this.buttons.on(BI.ButtonGroup.EVENT_CHANGE, function(){
+            self.model.set("child", this.getValue()[0]);
+        });
+
+        return BI.createWidget({
+            type: "bi.vertical",
+            vgap: 20,
+            items: [{
+                type: "bi.center",
+                items: [this.buttons],
+                height: 30
+            }, this.text]
+        });
+    },
+
+    _showModelData: function(){
+        this.text.setText("子级Model层数据: " + JSON.stringify(this.model.toJSON()));
+    },
+
+    render: function(vessel){
+        BI.createWidget({
+            type: "bi.center",
+            element: vessel,
+            items: [this._createOuter()]
+        });
+        this._showModelData();
+    }
+});
+
+
+ChangeInnerModel = BI.inherit(BI.Model, {
+    _defaultConfig: function(){
+        return BI.extend(ChangeInnerModel.superclass._defaultConfig.apply(this, arguments),{
+
+        })
+    },
+
+    _static: function(){
+        return {
+            items: [{
+                text: "Type-1",
+                value: "First",
+                cls: "type-first mvc-button"
+            }, {
+                text: "Type-2",
+                value: "Second",
+                cls: "type-second mvc-button"
+            }, {
+                text: "Type-3",
+                value: "third",
+                cls: "type-third mvc-button"
+            }]
+        }
+    },
+
+    _init: function(){
+        ChangeInnerModel.superclass._init.apply(this, arguments);
+    }
+
+});
+
+Demo.Func = BI.inherit(BI.Widget, {
+    render: function () {
+        var view = BI.View.createView("/change", {}, {
+            element: this
+        });
+        view.populate();
+    },
+
+    mounted: function () {
+    }
+});
+BI.shortcut("demo.change", Demo.Func);

demo/js/vm/local.js

@@ -0,0 +1,173 @@
+//local函数
+LocalView = BI.inherit(BI.View, {
+    _defaultConfig: function(){
+        return BI.extend(LocalView.superclass._defaultConfig.apply(this, arguments),{
+            baseCls: "bi-local"
+        })
+    },
+
+    _init: function(){
+        LocalView.superclass._init.apply(this, arguments);
+        this.buttons = {};
+    },
+
+    _addElement2Vessel: function(id){
+        var self = this;
+        this.buttons[id] = this.elementVessel.addItem({
+            type: "bi.text_button",
+            text: "Button:" + id,
+            width: 180,
+            height: 22,
+            cls: "delete-button button",
+            handler: function(){
+                self.set("delete", id);
+            }
+        })
+    },
+
+    _deleteElement: function(id){
+        this.buttons[id] && this.buttons[id].destroy();
+        delete this.buttons[id];
+    },
+
+    _createTop: function(){
+        var self = this;
+        this.elementVessel = BI.createWidget({
+            type: "bi.left",
+            height: 200,
+            cls: "vessel-border",
+            scrollable: true,
+            vgap: 10,
+            hgap: 10
+        });
+
+        return BI.createWidget({
+            type: "bi.vertical",
+            items: [
+                {
+                    el: {
+                        type: "bi.text_button",
+                        text: "点击添加元素",
+                        cls: "top-button",
+                        handler: function(){
+                            self.model.set("add", true);
+                        },
+                        height: 30
+                    }
+                },
+                this.elementVessel
+            ]
+        })
+    },
+
+    _showModelData: function(){
+        this.text.setText(JSON.stringify(this.model.toJSON()));
+    },
+
+    _createCenter: function(){
+        var modelData = BI.createWidget({
+            type: "bi.center",
+            vgap: 10,
+            hgap: 10,
+            cls: "vessel-border",
+            height: 200,
+            items: [{
+                el: this.text = BI.createWidget({
+                    type: "bi.label",
+                    hgap: 30,
+                    textHeight: 30,
+                    whiteSpace: "normal"
+                })
+            }]
+        });
+
+        return BI.createWidget({
+            type: "bi.vertical",
+            items: [
+                {
+                    el: {
+                        type: "bi.label",
+                        cls: "bottom-label",
+                        text: "Model层数据",
+                        height: 30
+                    }
+                },
+                modelData
+            ]
+        })
+    },
+
+    render: function(vessel){
+        BI.createWidget({
+            type: "bi.vertical",
+            element: vessel,
+            items: [{
+                el :this._createTop()
+            },{
+                el : this._createCenter()
+            }],
+            hgap: 50,
+            vgap: 20
+        });
+
+        this._showModelData();
+    },
+
+    local: function(){
+        if(this.model.has("add")){
+            var add = this.model.get("add");
+            this._addElement2Vessel(this.model.getEditing());
+            this._showModelData();
+            return true;
+        }
+        if(this.model.has("delete")){
+            var id = this.model.get("delete");
+            this._deleteElement(id);
+            this._showModelData();
+            return true;
+        }
+        return false;
+    }
+});
+
+LocalModel = BI.inherit(BI.Model, {
+    _defaultConfig: function(){
+        return BI.extend(LocalModel.superclass._defaultConfig.apply(this, arguments),{
+
+        })
+    },
+
+    _init: function(){
+        LocalModel.superclass._init.apply(this, arguments);
+    },
+
+    local: function(){
+        if(this.has("add")){
+            this.get("add");
+            var id = BI.UUID();
+            this.set(id, "这是新增的属性:"+id);
+            this.setEditing(id);
+            return true;
+        }
+        if(this.has("delete")){
+            var id = this.get("delete");
+            this.unset(id);
+            return true;
+        }
+        return false;
+    }
+
+});
+
+Demo.Func = BI.inherit(BI.Widget, {
+    render: function () {
+        var view = BI.View.createView("/local", {}, {
+            element: this
+        });
+        view.populate();
+    },
+
+    mounted: function () {
+    }
+});
+BI.shortcut("demo.local", Demo.Func);

demo/js/vm/setget.js

@@ -0,0 +1,129 @@
+//set、get函数
+SetGetView = BI.inherit(BI.View, {
+    _defaultConfig: function () {
+        return BI.extend(SetGetView.superclass._defaultConfig.apply(this, arguments), {
+            baseCls: "bi-set-get"
+        })
+    },
+
+    _init: function () {
+        SetGetView.superclass._init.apply(this, arguments);
+    },
+
+    change: function (changed) {
+        this._showModelData();
+    },
+
+    _createLeft: function () {
+        var self = this;
+        return (this.left = BI.createWidget({
+            type: "bi.border",
+            items: {
+                north: {
+                    el: {
+                        type: "bi.label",
+                        cls: "left-title",
+                        text: "get、set用法:",
+                        height: 30
+                    },
+                    height: 30
+                },
+                center: {
+                    el: {
+                        type: "bi.button_group",
+                        items: BI.createItems(this.model.get("arr"), {
+                            type: "bi.text_button",
+                            cls: "left-nav",
+                            height: 30,
+                            handler: function (v) {
+                                self.model.set("click", v);
+                            }
+                        }),
+                        layouts: [{
+                            type: "bi.vertical"
+                        }]
+                    }
+                }
+            }
+        }))
+    },
+
+    _showModelData: function () {
+        this.text.setText(JSON.stringify(this.model.toJSON()));
+    },
+
+    _createRight: function () {
+        return (this.right = BI.createWidget({
+            type: "bi.border",
+            items: {
+                north: {
+                    el: {
+                        type: "bi.label",
+                        cls: "right-title",
+                        text: "Model层数据",
+                        height: 30
+                    },
+                    height: 30
+                },
+                center: {
+                    el: this.text = BI.createWidget({
+                        type: "bi.label",
+                        whiteSpace: "normal",
+                        textHeight: 50
+                    })
+                }
+            }
+        }))
+    },
+
+    render: function (vessel) {
+        BI.createWidget({
+            type: "bi.center",
+            element: vessel,
+            items: [{
+                el: this._createLeft()
+            }, {
+                el: this._createRight()
+            }],
+            hgap: 50,
+            vgap: 100
+        })
+        this._showModelData();
+    }
+})
+
+SetGetModel = BI.inherit(BI.Model, {
+    _defaultConfig: function () {
+        return BI.extend(SetGetModel.superclass._defaultConfig.apply(this, arguments), {
+            arr: [
+                {text: "item1", value: 1},
+                {text: "item2", value: 2},
+                {text: "item3", value: 3},
+                {text: "item4", value: 4},
+                {text: "item5", value: 5},
+                {text: "item6", value: 6},
+                {text: "item7", value: 7},
+                {text: "item8", value: 8}
+            ]
+        })
+    },
+
+    _init: function () {
+        SetGetModel.superclass._init.apply(this, arguments);
+    }
+
+})
+
+
+Demo.Func = BI.inherit(BI.Widget, {
+    render: function () {
+        var view = BI.View.createView("/setget", {}, {
+            element: this
+        });
+        view.populate();
+    },
+
+    mounted: function () {
+    }
+});
+BI.shortcut("demo.setget", Demo.Func);

demo/js/vm/skipto.js

@@ -0,0 +1,267 @@
+//skipTo 函数
+SkipToView = BI.inherit(BI.View, {
+    _defaultConfig: function(){
+        return BI.extend(SkipToView.superclass._defaultConfig.apply(this, arguments),{
+            baseCls: "bi-skip-to"
+        })
+    },
+
+    _init: function(){
+        SkipToView.superclass._init.apply(this, arguments);
+    },
+
+    _createNav: function(){
+        var self = this;
+        var nav = BI.createWidget({
+            type: "bi.button_group",
+            cls: "top-nav",
+            items: BI.createItems(this.model.get("items"), {
+                type: "bi.text_button",
+                height: 30,
+                textAlign: "center",
+                hgap: 20
+            }),
+            layouts: [{
+                type: "bi.left",
+                height: 40,
+                vgap: 5,
+                hgap: 3
+            }]
+        });
+        nav.on(BI.ButtonGroup.EVENT_CHANGE, function(){
+            self.skipTo(this.getValue()[0], "pane", this.getValue()[0]);
+        });
+        return nav;
+    },
+
+    _createPane: function(){
+        var pane = BI.createWidget({
+            type:"bi.center",
+            cls: "center-pane",
+            height: 200
+        });
+        this.addSubVessel("pane", pane, {
+            defaultShowName: "green"
+        });
+        return pane;
+    },
+
+    render: function(vessel){
+        BI.createWidget({
+            type: "bi.vertical",
+            element: vessel,
+            items: [this._createNav(), this._createPane()],
+            vgap: 10,
+            hgap: 10
+        })
+    },
+
+    refresh: function(){
+        this.skipTo("green", "pane", "green");
+    }
+});
+
+SkipToModel = BI.inherit(BI.Model, {
+    _defaultConfig: function(){
+        return BI.extend(SkipToModel.superclass._defaultConfig.apply(this, arguments),{
+            "red": {
+                text: "hotpink"
+            },"blue": {
+                text: "cornflowerblue"
+            },"green": {
+                text: "darkcyan"
+            },"yellow": {
+                text: "darkgoldenrod"
+            }
+        })
+    },
+    _static: function(){
+        return {
+            items: [{
+                text: "hotpink",
+                value: "red",
+                cls: "red-pane mvc-button"
+            }, {
+                text: "cornflowerblue",
+                value: "blue",
+                cls: "blue-pane mvc-button"
+            }, {
+                text: "darkcyan",
+                value: "green",
+                cls: "green-pane mvc-button",
+                selected: true
+            }, {
+                text: "darkgoldenrod",
+                value: "yellow",
+                cls: "yellow-pane mvc-button"
+            }]
+        }
+    },
+
+    _init: function(){
+        SkipToModel.superclass._init.apply(this, arguments);
+    }
+});
+
+//Red pane #FF69B4
+SkipToRedView = BI.inherit(BI.View, {
+    _init: function(){
+        SkipToRedView.superclass._init.apply(this, arguments);
+    },
+
+    render: function(vessel){
+        BI.createWidget({
+            type: "bi.absolute",
+            element: vessel,
+            cls: "red-pane",
+            items: [{
+                el: {
+                    type: "bi.label",
+                    text: "Model Data: " + JSON.stringify(this.model.toJSON()),
+                    hgap: 20,
+                    height: 26
+                }
+            }]
+        })
+    }
+
+});
+
+SkipToRedModel = BI.inherit(BI.Model, {
+    _defaultConfig: function(){
+        return BI.extend(SetGetModel.superclass._defaultConfig.apply(this, arguments),{
+
+        })
+    },
+
+    _init: function(){
+        SkipToRedModel.superclass._init.apply(this, arguments);
+    }
+});
+
+//Blue pane #6495ED
+SkipToBlueView = BI.inherit(BI.View, {
+    _init: function(){
+        SkipToBlueView.superclass._init.apply(this, arguments);
+    },
+
+    render: function(vessel){
+        BI.createWidget({
+            type: "bi.absolute",
+            element: vessel,
+            cls: "blue-pane",
+            items: [{
+                el: {
+                    type: "bi.label",
+                    text: "Model Data: " + JSON.stringify(this.model.toJSON()),
+                    hgap: 20,
+                    height: 26
+                },
+                left: 0,
+                right: 0,
+                top: 0,
+                bottom: 0
+            }]
+        })
+    }
+});
+
+SkipToBlueModel = BI.inherit(BI.Model, {
+    _defaultConfig: function(){
+        return BI.extend(SetGetModel.superclass._defaultConfig.apply(this, arguments),{
+        })
+    },
+
+    _init: function(){
+        SkipToGreenModel.superclass._init.apply(this, arguments);
+    }
+});
+
+//Dark green pane #008B8B
+SkipToGreenView = BI.inherit(BI.View, {
+    _init: function(){
+        SkipToGreenView.superclass._init.apply(this, arguments);
+    },
+
+    render: function(vessel){
+        BI.createWidget({
+            type: "bi.absolute",
+            element: vessel,
+            cls: "green-pane",
+            items: [{
+                el:{
+                    type: "bi.label",
+                    text: "Model Data: " + JSON.stringify(this.model.toJSON()),
+                    hgap: 20,
+                    height: 26
+                },
+                left: 0,
+                right: 0,
+                top: 0,
+                bottom: 0
+            }]
+        })
+    }
+});
+
+SkipToGreenModel = BI.inherit(BI.Model, {
+    _defaultConfig: function(){
+        return BI.extend(SetGetModel.superclass._defaultConfig.apply(this, arguments),{
+        })
+    },
+
+    _init: function(){
+        SkipToGreenModel.superclass._init.apply(this, arguments);
+    }
+});
+
+//Dark yellow pane #B8860B
+SkipToYellowView = BI.inherit(BI.View, {
+    _init: function(){
+        SkipToYellowView.superclass._init.apply(this, arguments);
+    },
+
+    render: function(vessel){
+        BI.createWidget({
+            type: "bi.absolute",
+            element: vessel,
+            cls: "yellow-pane",
+            items: [{
+                el:{
+                    type: "bi.label",
+                    text: "Model Data: " + JSON.stringify(this.model.toJSON()),
+                    hgap: 20,
+                    height: 26
+                },
+                left: 0,
+                right: 0,
+                top: 0,
+                bottom: 0
+            }]
+        })
+    }
+});
+
+SkipToYellowModel = BI.inherit(BI.Model, {
+    _defaultConfig: function(){
+        return BI.extend(SetGetModel.superclass._defaultConfig.apply(this, arguments),{
+        })
+    },
+
+    _init: function(){
+        SkipToYellowModel.superclass._init.apply(this, arguments);
+    }
+});
+
+Demo.Func = BI.inherit(BI.Widget, {
+    render: function () {
+        var view = BI.View.createView("/skipTo", {}, {
+            element: this
+        });
+        view.populate();
+    },
+
+    mounted: function () {
+    }
+});
+BI.shortcut("demo.skipTo", Demo.Func);

demo/js/vm/spliceduplicate.js

@@ -0,0 +1,158 @@
+//splice和duplicate函数
+SpliceDuplicateView = BI.inherit(BI.View, {
+    _defaultConfig: function () {
+        return BI.extend(SpliceDuplicateView.superclass._defaultConfig.apply(this, arguments), {
+            baseCls: "bi-splice-duplicate"
+        })
+    },
+
+    _init: function () {
+        SpliceDuplicateView.superclass._init.apply(this, arguments);
+        this.children = {};
+    },
+
+    splice: function (old, key1, key2) {
+        this.children[key1].destroy();
+        delete this.children[key1];
+        this._showModelData();
+    },
+
+    duplicate: function (copy, key1, key2) {
+        this.add(copy);
+        this._showModelData();
+    },
+
+    _showModelData: function () {
+        //这里只是为了输出this.model.data   原则上是不允许这么调用的
+        this.text.setText("父级数据：" + JSON.stringify(this.model.data));
+    },
+
+    render: function (vessel) {
+        this.text = BI.createWidget({
+            type: "bi.label",
+            height: 50,
+            cls: "superiors-label"
+        });
+        this.container = BI.createWidget({
+            type: "bi.vertical",
+            element: vessel,
+            items: [this.text],
+            hgap: 100,
+            vgap: 10
+        });
+        this._showModelData();
+    },
+
+    add: function (id) {
+        this.children[id] = BI.createWidget({
+            type: "bi.center",
+            hgap: 10,
+            vgap: 10
+        });
+        this.addSubVessel(id, this.children[id], {
+            defaultShowName: "sdSub"
+        });
+        this.skipTo("sdSub", id, id);
+        this.container.addItem(this.children[id]);
+    },
+
+    refresh: function () {
+        var self = this;
+        BI.each(this.model.toJSON(), function (key, value) {
+            if (!self.children[key]) {
+                self.add(key);
+            }
+        })
+    }
+});
+
+SpliceDuplicateModel = BI.inherit(BI.Model, {
+    _defaultConfig: function () {
+        return BI.extend(SpliceDuplicateModel.superclass._defaultConfig.apply(this, arguments), {
+            "1": {
+                name: "名字"
+            }
+        })
+    },
+
+    splice: function (key1) {
+        delete this.data[key1];
+    },
+
+    similar: function (value, key1) {
+        value.name = BI.Func.createDistinctName(this.data, this.get(key1).name);
+        return value;
+    },
+
+    duplicate: function (copy, key1) {
+        this.data[copy] = this.get(copy);
+    },
+
+    _init: function () {
+        SpliceDuplicateModel.superclass._init.apply(this, arguments);
+    },
+
+    refresh: function () {
+        this.data = BI.deepClone(this.toJSON());
+    }
+});
+
+SDSubView = BI.inherit(BI.View, {
+    _defaultConfig: function () {
+        return SDSubView.superclass._defaultConfig.apply(this, arguments);
+    },
+
+    _init: function () {
+        SDSubView.superclass._init.apply(this, arguments);
+    },
+
+    render: function (vessel) {
+        var self = this;
+        BI.createWidget({
+            type: "bi.center",
+            element: vessel,
+            cls: "sd-child",
+            height: 30,
+            items: [{
+                type: "bi.text_button",
+                height: 30,
+                text: "复制  " + this.model.get("name") + " , 数据：" + JSON.stringify(this.model.toJSON()),
+                cls: "right-button-add",
+                handler: function () {
+                    self.model.copy();
+                }
+            }, {
+                type: "bi.text_button",
+                height: 30,
+                text: "删除",
+                cls: "right-button-del",
+                handler: function () {
+                    self.model.destroy();
+                }
+            }]
+        })
+    }
+});
+
+SDSubModel = BI.inherit(BI.Model, {
+    _defaultConfig: function () {
+        return BI.extend(SDSubModel.superclass._defaultConfig.apply(this, arguments), {});
+    },
+
+    _init: function () {
+        SDSubModel.superclass._init.apply(this, arguments);
+    }
+});
+
+Demo.Func = BI.inherit(BI.Widget, {
+    render: function () {
+        var view = BI.View.createView("/spliceDuplicate", {}, {
+            element: this
+        });
+        view.populate();
+    },
+
+    mounted: function () {
+    }
+});
+BI.shortcut("demo.spliceDuplicate", Demo.Func);

demo/js/vm/tmp.js

@@ -0,0 +1,286 @@
+TmpView = BI.inherit(BI.View, {
+    _defaultConfig: function(){
+        return BI.extend(TmpView.superclass._defaultConfig.apply(this, arguments),{
+            baseCls: "bi-tmp"
+        })
+    },
+
+    _init: function(){
+        TmpView.superclass._init.apply(this, arguments);
+    },
+
+    change: function(changed){
+        if(changed.data1){
+            this._showModelData();
+        }
+    },
+
+    _showModelData: function(){
+        this.text.setText("父级Model层数据为："+JSON.stringify(this.model.toJSON()));
+    },
+
+    _createMain: function(){
+        var self = this;
+        return BI.createWidget({
+            type: "bi.border",
+            items: {
+                west: {
+                    el: {
+                        type: "bi.vertical",
+                        vgap: 10,
+                        items: [{
+                            el: (this.text = BI.createWidget({
+                                type: "bi.label",
+                                whiteSpace: "normal"
+                            }))
+                        }, {
+                            el: {
+                                type: "bi.text_button",
+                                cls: "tmp-button mvc-button",
+                                text: "点击触发事件tmp('data1', {child: {type: {value: \"临时数据\"}}})",
+                                height: 30,
+                                handler: function(){
+                                    self.model.tmp("data1", {
+                                        child: {
+                                            type: {
+                                                value: "临时数据"
+                                            }
+                                        }
+                                    })
+                                }
+                            }
+                        }, {
+                            el: {
+                                type: "bi.text_button",
+                                cls: "tmp-button mvc-button",
+                                text: "点击触发事件submit",
+                                height: 30,
+                                handler: function(){
+                                    self.model.submit();
+                                }
+                            }
+                        }, {
+                            el: {
+                                type: "bi.text_button",
+                                cls: "tmp-button mvc-button",
+                                text: "点击跳转到右方",
+                                height: 30,
+                                handler: function(){
+                                    self.addSubVessel("test", self.center).skipTo("child", "test", "data1");
+                                }
+                            }
+                        }]
+                    },
+                    width: 200
+                },
+                center: {
+                    el: (this.center = BI.createWidget())
+                }
+            }
+        })
+    },
+
+    render: function(vessel){
+        BI.createWidget({
+            type: "bi.center",
+            element: vessel,
+            items: [{
+                el: this._createMain()
+            }],
+            hgap: 50,
+            vgap: 100
+        })
+    },
+
+    refresh: function(){
+        this._showModelData();
+    }
+})
+
+TmpModel = BI.inherit(BI.Model, {
+    _defaultConfig: function(){
+        return BI.extend(TmpModel.superclass._defaultConfig.apply(this, arguments),{
+            data1: {
+                child: {
+                    type: {
+                        value: "这是一个测试数据"
+                    }
+                }
+            },
+            data2: "test"
+        })
+    },
+
+    _init: function(){
+        TmpModel.superclass._init.apply(this, arguments);
+    }
+
+})
+
+TmpChildView = BI.inherit(BI.View, {
+    _defaultConfig: function(){
+        return BI.extend(TmpChildView.superclass._defaultConfig.apply(this, arguments),{
+            baseCls: "bi-tmp-child"
+        })
+    },
+
+    _init: function(){
+        TmpChildView.superclass._init.apply(this, arguments);
+    },
+
+    change: function(changed){
+        if(changed.child){
+            this._showModelData();
+        }
+    },
+
+    _showModelData: function(){
+        this.text.setText("子级Model层数据为："+JSON.stringify(this.model.toJSON()));
+    },
+
+    _createMain: function(){
+        var self = this;
+        return BI.createWidget({
+            type: "bi.border",
+            items: {
+                west: {
+                    el: {
+                        type: "bi.vertical",
+                        vgap: 10,
+                        items: [{
+                            el: (this.text = BI.createWidget({
+                                type: "bi.label",
+                                whiteSpace: "normal"
+                            }))
+                        }, {
+                            el: {
+                                type: "bi.text_button",
+                                cls: "tmp-button mvc-button",
+                                text: "点击触发事件set",
+                                height: 30,
+                                handler: function(){
+                                    self.set("child", {
+                                        type: {
+                                            value: "值改变了"
+                                        }
+                                    })
+                                }
+                            }
+                        }, {
+                            el: {
+                                type: "bi.text_button",
+                                cls: "tmp-button mvc-button",
+                                text: "点击跳转到右方",
+                                height: 30,
+                                handler: function(){
+                                    self.addSubVessel("test", self.center).skipTo("child", "test", "child");
+                                }
+                            }
+                        }]
+                    },
+                    width: 200
+                },
+                center: {
+                    el: (this.center = BI.createWidget())
+                }
+            }
+        })
+    },
+
+    render: function(vessel){
+        BI.createWidget({
+            type: "bi.center",
+            element: vessel,
+            items: [{
+                el: this._createMain()
+            }],
+            hgap: 50
+        })
+    },
+
+    refresh: function(){
+        this._showModelData();
+    }
+})
+
+TmpChildModel = BI.inherit(BI.Model, {
+    _defaultConfig: function(){
+        return BI.extend(TmpChildModel.superclass._defaultConfig.apply(this, arguments),{
+
+        })
+    },
+
+    _init: function(){
+        TmpChildModel.superclass._init.apply(this, arguments);
+    }
+
+})
+TmpChildChildView = BI.inherit(BI.View, {
+    _defaultConfig: function(){
+        return BI.extend(TmpChildChildView.superclass._defaultConfig.apply(this, arguments),{
+            baseCls: "bi-tmp-child-child"
+        })
+    },
+
+    _init: function(){
+        TmpChildChildView.superclass._init.apply(this, arguments);
+    },
+
+    change: function(changed){
+        if(changed.type){
+            this._showModelData();
+        }
+    },
+
+    _showModelData: function(){
+        this.text.setText("叶节点数据为："+JSON.stringify(this.model.toJSON()));
+    },
+
+    _createMain: function(){
+        return (this.text = BI.createWidget({
+            type: "bi.label",
+            whiteSpace: "normal"
+        }))
+    },
+
+    render: function(vessel){
+        BI.createWidget({
+            type: "bi.center",
+            element: vessel,
+            items: [{
+                el: this._createMain()
+            }],
+            hgap: 50
+        })
+    },
+
+    refresh: function(){
+        this._showModelData();
+    }
+})
+
+TmpChildChildModel = BI.inherit(BI.Model, {
+    _defaultConfig: function(){
+        return BI.extend(TmpChildChildModel.superclass._defaultConfig.apply(this, arguments),{
+
+        })
+    },
+
+    _init: function(){
+        TmpChildChildModel.superclass._init.apply(this, arguments);
+    }
+
+})
+
+Demo.Func = BI.inherit(BI.Widget, {
+    render: function () {
+        var view = BI.View.createView("/tmp", {}, {
+            element: this
+        });
+        view.populate();
+    },
+
+    mounted: function () {
+    }
+});
+BI.shortcut("demo.tmp", Demo.Func);

demo/js/widget/arrangment/demo.adaptive_arrangement.js

@@ -7,11 +7,11 @@ Demo.AdaptiveArrangement = BI.inherit(BI.Widget, {
             type: "bi.text_button",
             id: id,
             cls: "layout-bg" + BI.random(1, 8),
+            value: "点我我就在最上面了",
             handler: function () {
-                self.arrangement.deleteRegion(id);
+                // self.arrangement.deleteRegion(id);
             }
         });
-        item.setValue(item.attr("id"));
         return item;
     },
 
@@ -19,27 +19,23 @@ Demo.AdaptiveArrangement = BI.inherit(BI.Widget, {
         var self = this;
         this.arrangement = BI.createWidget({
             type: "bi.adaptive_arrangement",
-            layoutType: BI.Arrangement.LAYOUT_TYPE.ADAPTIVE,
+            layoutType: BI.Arrangement.LAYOUT_TYPE.FREE,
-            cls: "mvc-border",
+            cls: "bi-border",
             width: 800,
             height: 400,
             items: []
         });
         var drag = BI.createWidget({
             type: "bi.label",
-            cls: "mvc-border",
+            cls: "bi-border",
-            width: 100,
+            width: 70,
             height: 25,
             text: "drag me"
         });
 
-        // drag.element.draggable && 
         drag.element.draggable({
             revert: true,
-            cursorAt: {
+            cursorAt: {left: 0, top: 0},
-                left: 0,
-                top: 0
-            },
             drag: function (e, ui) {
                 self.arrangement.setPosition({
                     left: ui.position.left,
@@ -62,6 +58,7 @@ Demo.AdaptiveArrangement = BI.inherit(BI.Widget, {
 
         BI.createWidget({
             type: "bi.absolute",
+            element: this,
             items: [{
                 el: drag,
                 left: 30,
@@ -70,17 +67,6 @@ Demo.AdaptiveArrangement = BI.inherit(BI.Widget, {
                 el: this.arrangement,
                 left: 30,
                 top: 30
-            }, {
-                el: {
-                    type: "bi.button",
-                    text: "回撤",
-                    height: 25,
-                    handler: function () {
-                        //self.arrangement.revoke();
-                    }
-                },
-                left: 130,
-                top: 450
             }, {
                 el: {
                     type: "bi.button",

demo/js/widget/arrangment/demo.arrangement.js

@@ -0,0 +1,100 @@
+Demo.Arrangement = BI.inherit(BI.Widget, {
+
+    beforeCreate: function () {
+        this.index = 0;
+    },
+
+    _createItem: function () {
+        var self = this;
+        var item = BI.createWidget({
+            type: "bi.text_button",
+            id: this.index,
+            text: "点我删掉",
+            cls: "layout-bg" + BI.random(1, 8),
+            handler: function () {
+                self.arrangement.deleteRegion(this.attr("id"));
+            }
+        });
+        this.index++;
+        return item;
+    },
+
+    render: function () {
+        var self = this;
+        this.arrangement = BI.createWidget({
+            type: "bi.arrangement",
+            layoutType: BI.Arrangement.LAYOUT_TYPE.GRID,
+            cls: "bi-border",
+            width: 800,
+            height: 400,
+            items: []
+        });
+        var drag = BI.createWidget({
+            type: "bi.label",
+            cls: "bi-border",
+            width: 70,
+            height: 25,
+            text: "drag me"
+        });
+
+        drag.element.draggable({
+            revert: true,
+            cursorAt: {left: 0, top: 0},
+            drag: function (e, ui) {
+                self.arrangement.setPosition({
+                    left: ui.position.left,
+                    top: ui.position.top
+                }, {
+                    width: 300,
+                    height: 200
+                })
+            },
+            stop: function (e, ui) {
+                self.arrangement.addRegion({
+                    el: self._createItem()
+                });
+            },
+            helper: function (e) {
+                var helper = self.arrangement.getHelper();
+                return helper.element;
+            }
+        });
+
+        BI.createWidget({
+            type: "bi.absolute",
+            element: this,
+            items: [{
+                el: drag,
+                left: 30,
+                top: 450
+            }, {
+                el: this.arrangement,
+                left: 30,
+                top: 30
+            }, {
+                el: {
+                    type: "bi.button",
+                    text: "getAllRegions",
+                    height: 25,
+                    handler: function () {
+                        var items = [];
+                        BI.each(self.arrangement.getAllRegions(), function (i, region) {
+                            items.push({
+                                id: region.id,
+                                left: region.left,
+                                top: region.top,
+                                width: region.width,
+                                height: region.height
+                            });
+                        });
+                        BI.Msg.toast(JSON.stringify(items));
+                    }
+                },
+                left: 230,
+                top: 450
+            }]
+        });
+    }
+});
+
+BI.shortcut("demo.arrangement", Demo.Arrangement);

demo/js/widget/arrangment/demo.interactive_arrangement.js

@@ -2,12 +2,107 @@
  * Created by User on 2017/3/22.
  */
 Demo.RelationView = BI.inherit(BI.Widget, {
-    props: {
+    _createItem: function () {
+        var self = this;
+        var id = BI.UUID();
+        var item = BI.createWidget({
+            type: "bi.text_button",
+            id: id,
+            text: "对齐的时候是不是有根线？",
+            cls: "layout-bg" + BI.random(1, 8),
+            handler: function () {
+                self.arrangement.deleteRegion(id);
+            }
+        });
+        return item;
     },
+
     render: function () {
-        return {
+        var self = this;
+        this.arrangement = BI.createWidget({
             type: "bi.interactive_arrangement",
-        };
+            layoutType: BI.Arrangement.LAYOUT_TYPE.FREE,
+            cls: "bi-border",
+            width: 800,
+            height: 400,
+            items: []
+        });
+        var drag = BI.createWidget({
+            type: "bi.label",
+            cls: "bi-border",
+            width: 70,
+            height: 25,
+            text: "drag me"
+        });
+
+        drag.element.draggable({
+            revert: true,
+            cursorAt: {left: 0, top: 0},
+            drag: function (e, ui) {
+                self.arrangement.setPosition({
+                    left: ui.position.left,
+                    top: ui.position.top
+                }, {
+                    width: 300,
+                    height: 200
+                })
+            },
+            stop: function (e, ui) {
+                self.arrangement.addRegion({
+                    el: self._createItem()
+                });
+            },
+            helper: function (e) {
+                var helper = self.arrangement.getHelper();
+                return helper.element;
+            }
+        });
+
+        BI.createWidget({
+            type: "bi.absolute",
+            element: this,
+            items: [{
+                el: drag,
+                left: 30,
+                top: 450
+            }, {
+                el: this.arrangement,
+                left: 30,
+                top: 30
+            }, {
+                el: {
+                    type: "bi.button",
+                    text: "getAllRegions",
+                    height: 25,
+                    handler: function () {
+                        var items = [];
+                        BI.each(self.arrangement.getAllRegions(), function (i, region) {
+                            items.push({
+                                id: region.id,
+                                left: region.left,
+                                top: region.top,
+                                width: region.width,
+                                height: region.height
+                            });
+                        });
+                        BI.Msg.toast(JSON.stringify(items));
+                    }
+                },
+                left: 230,
+                top: 450
+            }, {
+                el: {
+                    type: "bi.button",
+                    text: "relayout",
+                    height: 25,
+                    handler: function () {
+                        self.arrangement.relayout();
+                    }
+                },
+                left: 330,
+                top: 450
+            }]
+        });
     }
 });
 BI.shortcut("demo.interactive_arrangement", Demo.RelationView);

demo/less/vm.less

@@ -0,0 +1,123 @@
+@import "index";
+
+.mvc-button {
+  &:hover, &.hover {
+    .opacity(0.5);
+  }
+  &.active, &:active {
+    .opacity(0.5)
+  }
+}
+
+.bi-set-get {
+  & .left-title, & .right-title {
+    background: #0088cc;
+    color: #ffffff;
+  }
+  & .left-nav {
+    border-bottom: 1px solid #cccccc;
+    &.active, &:active {
+      color: #ffffff;
+      background-color: #d9534f;
+    }
+  }
+}
+
+.bi-local {
+  & .top-button {
+    background-color: #448eea;
+    color: #ffffff
+  }
+  & .bottom-label {
+    background-color: #EA4738;
+    color: #ffffff;
+  }
+  & .delete-button {
+    background-color: #008B8B;
+    color: #ffffff;
+  }
+  & .vessel-border {
+    border-left: 1px solid #cccccc;
+    border-bottom: 1px solid #cccccc;
+    border-right: 1px solid #cccccc;
+  }
+}
+
+.bi-event {
+  & .title {
+    background: #0088cc;
+    color: #ffffff;
+  }
+  & .front {
+    background: #ADD8E6;
+  }
+  & .nav {
+    border: 1px solid #cccccc;
+  }
+}
+
+.bi-skip-to {
+  color: #ffffff;
+
+  & .red-pane {
+    background-color: #0088cc;
+  }
+  & .blue-pane {
+    background-color: #6495ED;
+  }
+  & .green-pane {
+    background-color: #008B8B;
+  }
+  & .yellow-pane {
+    background-color: #B8860B;
+  }
+}
+
+.bi-change {
+  & .outer-text {
+    background-color: #0088cc;
+    color: #ffffff;
+  }
+  & .inner {
+    border-left: 1px solid #cccccc;
+    border-bottom: 1px solid #cccccc;
+    border-right: 1px solid #cccccc;
+  }
+
+  & .type-first {
+    background-color: #008B8B;
+  }
+
+  & .type-second {
+    background-color: #6495ED;
+  }
+
+  & .type-third {
+    background-color: #0088cc;
+  }
+}
+
+.bi-tmp {
+  & .tmp-button {
+    color: #ffffff;
+    background: #0088cc;
+  }
+}
+
+.bi-splice-duplicate {
+  & .superiors-label {
+    color: white;
+    background-color: #008B8B;
+  }
+  & .sd-child {
+    border: 1px solid #cccccc;
+    & .right-button-add {
+      color: white;
+      background-color: #0088cc;
+    }
+    & .right-button-del {
+      color: white;
+      background-color: #d9534f;
+    }
+  }
+}

dist/base.js

@@ -3897,17 +3897,13 @@ BI.shortcut("bi.combo_group", BI.ComboGroup);BI.VirtualGroup = BI.inherit(BI.Wid
     },
 
     setValue: function (v) {
-        this.layouts.setValue(v);
+        // this.layouts.setValue(v);
     },
 
     getValue: function () {
         return this.layouts.getValue();
     },
 
-    empty: function () {
-        this.layouts.empty();
-    },
-
     populate: function (items) {
         var self = this;
         items = items || [];
@@ -16333,9 +16329,11 @@ BI.RichEditorParamAction = BI.inherit(BI.RichEditorAction, {
         var instance = o.editor.selectedInstance;
         var next = $param.next();
         if (next.length === 0 || this._isParam(next)) {
-            var node = this._createBlankNode();
+            var preNode = this._createBlankNode();
-            $param.after(node);
+            var nextNode = this._createBlankNode();
-            instance.setFocus(node[0]);
+            $param.before(preNode);
+            $param.after(nextNode);
+            instance.setFocus(nextNode[0]);
         } else {
             instance.setFocus(next[0]);
         }
@@ -16589,7 +16587,7 @@ BI.shortcut('bi.rich_editor_text_toolbar', BI.RichEditorTextToolbar);/**
         start: function () {
             this.elm.element.attr("contentEditable", true);
             if (this.getContent() == "") {
-                this.setContent("<br />");
+                // this.setContent("<br />");
             }
             this.instanceDoc = document.defaultView;
             this.elm.element.on('mousedown', BI.bind(this.selected, this));

dist/bundle.js

@@ -12375,9 +12375,6 @@ BI.Factory = {
         // manipulation API.
         _removeElement: function () {
             this.$el.remove();
-            if ($.browser.msie === true) {
-                this.el.outerHTML = '';
-            }
         },
 
         // Change the view's element (`this.el` property) and re-delegate the
@@ -12418,7 +12415,7 @@ BI.Factory = {
         // alternative DOM manipulation API and are only required to set the
         // `this.el` property.
         _setElement: function (el) {
-            this.$el = el instanceof BI.$ ? el : BI.$(el);
+            this.$el = el instanceof BI.$ ? el : (BI.isWidget(el) ? el.element : BI.$(el));
             this.element = this.$el;
             this.el = this.$el[0];
         },
@@ -12829,8 +12826,8 @@ BI.Factory = {
 
             // Add a cross-platform `addEventListener` shim for older browsers.
             var addEventListener = window.addEventListener || function (eventName, listener) {
-                    return attachEvent('on' + eventName, listener);
+                return attachEvent('on' + eventName, listener);
-                };
+            };
 
             // Depending on whether we're using pushState or hashes, and whether
             // 'onhashchange' is supported, determine how we check the URL state.
@@ -12850,8 +12847,8 @@ BI.Factory = {
         stop: function () {
             // Add a cross-platform `removeEventListener` shim for older browsers.
             var removeEventListener = window.removeEventListener || function (eventName, listener) {
-                    return detachEvent('on' + eventName, listener);
+                return detachEvent('on' + eventName, listener);
-                };
+            };
 
             // Remove window listeners.
             if (this._hasPushState) {
@@ -14791,7 +14788,7 @@ BI.Widget = BI.inherit(BI.OB, {
     __d: function () {
         this.beforeDestroy && this.beforeDestroy();
         BI.each(this._children, function (i, widget) {
-            widget._unMount && widget._unMount();
+            widget && widget._unMount && widget._unMount();
         });
         this._children = {};
         this._parent = null;
@@ -14814,7 +14811,7 @@ BI.Widget = BI.inherit(BI.OB, {
 
     empty: function () {
         BI.each(this._children, function (i, widget) {
-            widget._unMount && widget._unMount();
+            widget && widget._unMount && widget._unMount();
         });
         this._children = {};
         this.element.empty();
@@ -15534,8 +15531,8 @@ BI.View = BI.inherit(BI.V, {
         return this;
     },
 
-    createView: function (url, modelData, viewData) {
+    createView: function (url, modelData, viewData, context) {
-        return BI.Factory.createView(url, this.get(url), modelData, viewData);
+        return BI.Factory.createView(url, this.get(url), modelData, viewData, context);
     },
 
     /**
@@ -15573,7 +15570,7 @@ BI.View = BI.inherit(BI.V, {
         }
         cardLayout.setVisible(true);
         if (BI.isKey(cardName) && !cardLayout.isCardExisted(cardName)) {
-            var view = this.createView(this.rootURL + "/" + cardName, data, viewData);
+            var view = this.createView(this.rootURL + "/" + cardName, data, viewData, this);
             isValid && this.model.addChild(modelData, view.model);
             view.listenTo(view.model, "destroy", function () {
                 delete self._cards[cardName];
@@ -15699,6 +15696,7 @@ BI.View = BI.inherit(BI.V, {
                 success && success(data, model);
             }
         }));
+
         function callback(data) {
             self.model.load(data);
             self.load(data);
@@ -15876,7 +15874,14 @@ BI.View = BI.inherit(BI.V, {
         this.trigger(BI.Events.DESTROY);
         this.off();
     }
-});(function () {
+});
+
+BI.View.registerVMRouter = function (viewRouter, modelRouter) {
+    //配置View
+    BI.View.createView = BI.View.prototype.createView = function (url, modelData, viewData, context) {
+        return BI.Factory.createView(url, viewRouter.get(url), _.extend({}, modelRouter.get(url), modelData), viewData || {}, context);
+    };
+};(function () {
     var kv = {};
     BI.shortcut = function (xtype, cls) {
         if (kv[xtype] != null) {
@@ -15891,8 +15896,7 @@ BI.View = BI.inherit(BI.V, {
             return new (new Function('return ' + config['classType'] + ';')())(config);
         }
 
-        var xtype = config.type.toLowerCase();
+        var cls = kv[config.type];
-        var cls = kv[xtype];
         return new cls(config);
     };
 
@@ -18934,7 +18938,7 @@ $.extend(BI, {
             }
             child.setParent(this);
             if (cur >= 0) {
-                this.getChild(cur).setRight(child);
+                this.getChild(cur) && this.getChild(cur).setRight(child);
                 child.setLeft(this.getChild(cur));
             }
             if (BI.isUndefined(index)) {
@@ -19883,31 +19887,161 @@ BI.Layout = BI.inherit(BI.Widget, {
         })
     },
 
-    update: function (item) {
+    patchItem: function (oldVnode, vnode, index) {
-        var o = this.options;
+        if (!this._compare(oldVnode, vnode)) {
-        var items = item.items || [];
+            return this.updateItemAt(index, vnode);
-        var updated, i, len;
+        }
-        for (i = 0, len = Math.min(o.items.length, items.length); i < len; i++) {
+    },
-            if (!this._compare(o.items[i], items[i])) {
+
-                updated = this.updateItemAt(i, items[i]) || updated;
+    updateChildren: function (oldCh, newCh) {
-            }
+        var self = this;
-        }
+        var oldStartIdx = 0, newStartIdx = 0;
-        if (o.items.length > items.length) {
+        var oldEndIdx = oldCh.length - 1;
-            var deleted = [];
+        var oldStartVnode = oldCh[0];
-            for (i = items.length; i < o.items.length; i++) {
+        var oldEndVnode = oldCh[oldEndIdx];
-                deleted.push(this._children[this._getChildName(i)]);
+        var newEndIdx = newCh.length - 1;
-                delete this._children[this._getChildName(i)];
+        var newStartVnode = newCh[0];
-            }
+        var newEndVnode = newCh[newEndIdx];
-            o.items.splice(items.length);
+        var before;
-            BI.each(deleted, function (i, w) {
+        var updated;
-                w._destroy();
+        var children = {};
-            })
+        BI.each(oldCh, function (i, child) {
-        } else if (items.length > o.items.length) {
+            child = self._getOptions(child);
-            for (i = o.items.length; i < items.length; i++) {
+            var key = child.key == null ? i : child.key;
-                this.addItemAt(i, items[i]);
+            if (BI.isKey(key)) {
+                children[key] = self._children[self._getChildName(i)];
+            }
+        });
+
+        while (oldStartIdx <= oldEndIdx && newStartIdx <= newEndIdx) {
+            if (BI.isNull(oldStartVnode)) {
+                oldStartVnode = oldCh[++oldStartIdx];
+            } else if (BI.isNull(oldEndVnode)) {
+                oldEndVnode = oldCh[--oldEndIdx];
+            } else if (sameVnode(oldStartVnode, newStartVnode, oldStartIdx, newStartIdx)) {
+                updated = this.patchItem(oldStartVnode, newStartVnode, oldStartIdx) || updated;
+                oldStartVnode = oldCh[++oldStartIdx];
+                newStartVnode = newCh[++newStartIdx];
+            } else if (sameVnode(oldEndVnode, newEndVnode, oldEndIdx, newEndIdx)) {
+                updated = this.patchItem(oldEndVnode, newEndVnode, oldEndIdx) || updated;
+                oldEndVnode = oldCh[--oldEndIdx];
+                newEndVnode = newCh[--newEndIdx];
+            } else if (sameVnode(oldStartVnode, newEndVnode)) {
+                updated = this.patchItem(oldStartVnode, newEndVnode, oldStartIdx) || updated;
+                insertBefore(oldStartVnode, oldEndVnode, true);
+                oldStartVnode = oldCh[++oldStartIdx];
+                newEndVnode = newCh[--newEndIdx];
+            } else if (sameVnode(oldEndVnode, newStartVnode)) {
+                updated = this.patchItem(oldEndVnode, newStartVnode, oldEndIdx) || updated;
+                insertBefore(oldEndVnode, oldStartVnode);
+                oldEndVnode = oldCh[--oldEndIdx];
+                newStartVnode = newCh[++newStartIdx];
+            } else {
+                var node = addNode(newStartVnode);
+                insertBefore(node, oldStartVnode);
+                newStartVnode = newCh[++newStartIdx];
             }
         }
+        if (oldStartIdx > oldEndIdx) {
+            before = BI.isNull(newCh[newEndIdx + 1]) ? null : newCh[newEndIdx + 1].elm;
+            addVnodes(before, newCh, newStartIdx, newEndIdx);
+        } else if (newStartIdx > newEndIdx) {
+            removeVnodes(oldCh, oldStartIdx, oldEndIdx);
+        }
+
+        this._children = {};
+        BI.each(newCh, function (i, child) {
+            var node = self._getOptions(child);
+            var key = node.key == null ? i : node.key;
+            children[key]._mount();
+            self._children[self._getChildName(i)] = children[key];
+        });
+
+        function sameVnode(vnode1, vnode2, oldIndex, newIndex) {
+            vnode1 = self._getOptions(vnode1);
+            vnode2 = self._getOptions(vnode2);
+            if (BI.isKey(vnode1.key)) {
+                return vnode1.key === vnode2.key;
+            }
+            if (oldIndex >= 0) {
+                return oldIndex === newIndex
+            }
+        }
+
+        function addNode(vnode, index) {
+            var opt = self._getOptions(vnode);
+            var key = opt.key == null ? index : opt.key;
+            return children[key] = self._addElement(key, vnode);
+        }
+
+        function addVnodes(before, vnodes, startIdx, endIdx) {
+            for (; startIdx <= endIdx; ++startIdx) {
+                var node = addNode(vnodes[startIdx], startIdx);
+                insertBefore(node, before, false, startIdx);
+            }
+        }
+
+        function removeVnodes(vnodes, startIdx, endIdx) {
+            for (; startIdx <= endIdx; ++startIdx) {
+                var node = self._getOptions(vnodes[startIdx]);
+                var key = node.key == null ? startIdx : node.key;
+                children[key]._destroy();
+            }
+        }
+
+        function insertBefore(insert, before, isNext, index) {
+            insert = self._getOptions(insert);
+            before = before && self._getOptions(before);
+            var insertKey = BI.isKey(insert.key) ? insert.key : index;
+            if (before && children[before.key]) {
+                var beforeKey = BI.isKey(before.key) ? before.key : index;
+                var next;
+                if (isNext) {
+                    next = children[beforeKey].element.next();
+                } else {
+                    next = children[beforeKey].element;
+                }
+                if (next.length > 0) {
+                    next.before(children[insertKey].element);
+                } else {
+                    self._getWrapper().append(children[insertKey].element);
+                }
+            } else {
+                self._getWrapper().append(children[insertKey].element);
+            }
+        }
+
+        return updated;
+    },
+
+    update: function (opt) {
+        var o = this.options;
+        var items = opt.items || [];
+        var updated = this.updateChildren(o.items, items);
+        this.options.items = items;
         return updated;
+        // var updated, i, len;
+        // for (i = 0, len = Math.min(o.items.length, items.length); i < len; i++) {
+        //     if (!this._compare(o.items[i], items[i])) {
+        //         updated = this.updateItemAt(i, items[i]) || updated;
+        //     }
+        // }
+        // if (o.items.length > items.length) {
+        //     var deleted = [];
+        //     for (i = items.length; i < o.items.length; i++) {
+        //         deleted.push(this._children[this._getChildName(i)]);
+        //         delete this._children[this._getChildName(i)];
+        //     }
+        //     o.items.splice(items.length);
+        //     BI.each(deleted, function (i, w) {
+        //         w._destroy();
+        //     })
+        // } else if (items.length > o.items.length) {
+        //     for (i = o.items.length; i < items.length; i++) {
+        //         this.addItemAt(i, items[i]);
+        //     }
+        // }
+        // return updated;
     },
 
     stroke: function (items) {
@@ -22832,7 +22966,25 @@ BI.extend(jQuery, {
  */
 BI.Func = {};
 BI.extend(BI.Func, {
-
+    /**
+     * 创建唯一的名字
+     * @param array
+     * @param name
+     * @returns {*}
+     */
+    createDistinctName: function (array, name) {
+        var src = name, idx = 1;
+        name = name || "";
+        while (true) {
+            if (BI.every(array, function (i, item) {
+                    return item.name !== name;
+                })) {
+                break;
+            }
+            name = src + (idx++);
+        }
+        return name;
+    },
     /**
      * 获取搜索结果
      * @param items
@@ -27440,7 +27592,7 @@ BI.HorizontalLayout = BI.inherit(BI.Layout, {
     props: function () {
         return BI.extend(BI.HorizontalLayout.superclass.props.apply(this, arguments), {
             baseCls: "bi-horizontal-layout",
-            verticalAlign: "middle",
+            verticalAlign: BI.VerticalAlign.Top,
             columnSize: [],
             scrollx: true,
             hgap: 0,
@@ -32768,17 +32920,13 @@ BI.shortcut("bi.combo_group", BI.ComboGroup);BI.VirtualGroup = BI.inherit(BI.Wid
     },
 
     setValue: function (v) {
-        this.layouts.setValue(v);
+        // this.layouts.setValue(v);
     },
 
     getValue: function () {
         return this.layouts.getValue();
     },
 
-    empty: function () {
-        this.layouts.empty();
-    },
-
     populate: function (items) {
         var self = this;
         items = items || [];
@@ -45204,9 +45352,11 @@ BI.RichEditorParamAction = BI.inherit(BI.RichEditorAction, {
         var instance = o.editor.selectedInstance;
         var next = $param.next();
         if (next.length === 0 || this._isParam(next)) {
-            var node = this._createBlankNode();
+            var preNode = this._createBlankNode();
-            $param.after(node);
+            var nextNode = this._createBlankNode();
-            instance.setFocus(node[0]);
+            $param.before(preNode);
+            $param.after(nextNode);
+            instance.setFocus(nextNode[0]);
         } else {
             instance.setFocus(next[0]);
         }
@@ -45460,7 +45610,7 @@ BI.shortcut('bi.rich_editor_text_toolbar', BI.RichEditorTextToolbar);/**
         start: function () {
             this.elm.element.attr("contentEditable", true);
             if (this.getContent() == "") {
-                this.setContent("<br />");
+                // this.setContent("<br />");
             }
             this.instanceDoc = document.defaultView;
             this.elm.element.on('mousedown', BI.bind(this.selected, this));
@@ -84261,9 +84411,9 @@ BI.MonthTrigger = BI.inherit(BI.Trigger, {
             this.editor.setTitle(v + 1);
             return;
         }
-        this.editor.setState();
+        this.editor.setState("");
-        this.editor.setValue();
+        this.editor.setValue("");
-        this.editor.setTitle();
+        this.editor.setTitle("");
     },
     getKey: function () {
         return this.editor.getValue() | 0;
@@ -88370,9 +88520,11 @@ BI.MultiSelectList = BI.inherit(BI.Widget, {
             cls: "popup-multi-select-list bi-border-left bi-border-right bi-border-bottom",
             itemsCreator: o.itemsCreator,
             valueFormatter: o.valueFormatter,
+            logic: {
+                dynamic: false
+            },
             // onLoaded: o.onLoaded,
             el: {
-                height: ""
             }
         });
         this.adapter.on(BI.MultiSelectLoader.EVENT_CHANGE, function () {
@@ -91714,6 +91866,7 @@ BI.QuarterTrigger = BI.inherit(BI.Trigger, {
     },
 
     setValue: function (v) {
+        v = v || "";
         this.editor.setState(v);
         this.editor.setValue(v);
         this.editor.setTitle(v);
@@ -94351,7 +94504,7 @@ BI.YearCombo = BI.inherit(BI.Widget, {
     },
 
     setValue: function (v) {
-        this.combo.setValue(v);
+        this.combo.setValue(v || "");
     },
 
     getValue: function () {

dist/core.js

@@ -12324,9 +12324,6 @@ BI.Factory = {
         // manipulation API.
         _removeElement: function () {
             this.$el.remove();
-            if ($.browser.msie === true) {
-                this.el.outerHTML = '';
-            }
         },
 
         // Change the view's element (`this.el` property) and re-delegate the
@@ -12367,7 +12364,7 @@ BI.Factory = {
         // alternative DOM manipulation API and are only required to set the
         // `this.el` property.
         _setElement: function (el) {
-            this.$el = el instanceof BI.$ ? el : BI.$(el);
+            this.$el = el instanceof BI.$ ? el : (BI.isWidget(el) ? el.element : BI.$(el));
             this.element = this.$el;
             this.el = this.$el[0];
         },
@@ -12778,8 +12775,8 @@ BI.Factory = {
 
             // Add a cross-platform `addEventListener` shim for older browsers.
             var addEventListener = window.addEventListener || function (eventName, listener) {
-                    return attachEvent('on' + eventName, listener);
+                return attachEvent('on' + eventName, listener);
-                };
+            };
 
             // Depending on whether we're using pushState or hashes, and whether
             // 'onhashchange' is supported, determine how we check the URL state.
@@ -12799,8 +12796,8 @@ BI.Factory = {
         stop: function () {
             // Add a cross-platform `removeEventListener` shim for older browsers.
             var removeEventListener = window.removeEventListener || function (eventName, listener) {
-                    return detachEvent('on' + eventName, listener);
+                return detachEvent('on' + eventName, listener);
-                };
+            };
 
             // Remove window listeners.
             if (this._hasPushState) {
@@ -14740,7 +14737,7 @@ BI.Widget = BI.inherit(BI.OB, {
     __d: function () {
         this.beforeDestroy && this.beforeDestroy();
         BI.each(this._children, function (i, widget) {
-            widget._unMount && widget._unMount();
+            widget && widget._unMount && widget._unMount();
         });
         this._children = {};
         this._parent = null;
@@ -14763,7 +14760,7 @@ BI.Widget = BI.inherit(BI.OB, {
 
     empty: function () {
         BI.each(this._children, function (i, widget) {
-            widget._unMount && widget._unMount();
+            widget && widget._unMount && widget._unMount();
         });
         this._children = {};
         this.element.empty();
@@ -15483,8 +15480,8 @@ BI.View = BI.inherit(BI.V, {
         return this;
     },
 
-    createView: function (url, modelData, viewData) {
+    createView: function (url, modelData, viewData, context) {
-        return BI.Factory.createView(url, this.get(url), modelData, viewData);
+        return BI.Factory.createView(url, this.get(url), modelData, viewData, context);
     },
 
     /**
@@ -15522,7 +15519,7 @@ BI.View = BI.inherit(BI.V, {
         }
         cardLayout.setVisible(true);
         if (BI.isKey(cardName) && !cardLayout.isCardExisted(cardName)) {
-            var view = this.createView(this.rootURL + "/" + cardName, data, viewData);
+            var view = this.createView(this.rootURL + "/" + cardName, data, viewData, this);
             isValid && this.model.addChild(modelData, view.model);
             view.listenTo(view.model, "destroy", function () {
                 delete self._cards[cardName];
@@ -15648,6 +15645,7 @@ BI.View = BI.inherit(BI.V, {
                 success && success(data, model);
             }
         }));
+
         function callback(data) {
             self.model.load(data);
             self.load(data);
@@ -15825,7 +15823,14 @@ BI.View = BI.inherit(BI.V, {
         this.trigger(BI.Events.DESTROY);
         this.off();
     }
-});(function () {
+});
+
+BI.View.registerVMRouter = function (viewRouter, modelRouter) {
+    //配置View
+    BI.View.createView = BI.View.prototype.createView = function (url, modelData, viewData, context) {
+        return BI.Factory.createView(url, viewRouter.get(url), _.extend({}, modelRouter.get(url), modelData), viewData || {}, context);
+    };
+};(function () {
     var kv = {};
     BI.shortcut = function (xtype, cls) {
         if (kv[xtype] != null) {
@@ -15840,8 +15845,7 @@ BI.View = BI.inherit(BI.V, {
             return new (new Function('return ' + config['classType'] + ';')())(config);
         }
 
-        var xtype = config.type.toLowerCase();
+        var cls = kv[config.type];
-        var cls = kv[xtype];
         return new cls(config);
     };
 
@@ -18883,7 +18887,7 @@ $.extend(BI, {
             }
             child.setParent(this);
             if (cur >= 0) {
-                this.getChild(cur).setRight(child);
+                this.getChild(cur) && this.getChild(cur).setRight(child);
                 child.setLeft(this.getChild(cur));
             }
             if (BI.isUndefined(index)) {
@@ -19832,31 +19836,161 @@ BI.Layout = BI.inherit(BI.Widget, {
         })
     },
 
-    update: function (item) {
+    patchItem: function (oldVnode, vnode, index) {
-        var o = this.options;
+        if (!this._compare(oldVnode, vnode)) {
-        var items = item.items || [];
+            return this.updateItemAt(index, vnode);
-        var updated, i, len;
+        }
-        for (i = 0, len = Math.min(o.items.length, items.length); i < len; i++) {
+    },
-            if (!this._compare(o.items[i], items[i])) {
+
-                updated = this.updateItemAt(i, items[i]) || updated;
+    updateChildren: function (oldCh, newCh) {
-            }
+        var self = this;
-        }
+        var oldStartIdx = 0, newStartIdx = 0;
-        if (o.items.length > items.length) {
+        var oldEndIdx = oldCh.length - 1;
-            var deleted = [];
+        var oldStartVnode = oldCh[0];
-            for (i = items.length; i < o.items.length; i++) {
+        var oldEndVnode = oldCh[oldEndIdx];
-                deleted.push(this._children[this._getChildName(i)]);
+        var newEndIdx = newCh.length - 1;
-                delete this._children[this._getChildName(i)];
+        var newStartVnode = newCh[0];
-            }
+        var newEndVnode = newCh[newEndIdx];
-            o.items.splice(items.length);
+        var before;
-            BI.each(deleted, function (i, w) {
+        var updated;
-                w._destroy();
+        var children = {};
-            })
+        BI.each(oldCh, function (i, child) {
-        } else if (items.length > o.items.length) {
+            child = self._getOptions(child);
-            for (i = o.items.length; i < items.length; i++) {
+            var key = child.key == null ? i : child.key;
-                this.addItemAt(i, items[i]);
+            if (BI.isKey(key)) {
+                children[key] = self._children[self._getChildName(i)];
+            }
+        });
+
+        while (oldStartIdx <= oldEndIdx && newStartIdx <= newEndIdx) {
+            if (BI.isNull(oldStartVnode)) {
+                oldStartVnode = oldCh[++oldStartIdx];
+            } else if (BI.isNull(oldEndVnode)) {
+                oldEndVnode = oldCh[--oldEndIdx];
+            } else if (sameVnode(oldStartVnode, newStartVnode, oldStartIdx, newStartIdx)) {
+                updated = this.patchItem(oldStartVnode, newStartVnode, oldStartIdx) || updated;
+                oldStartVnode = oldCh[++oldStartIdx];
+                newStartVnode = newCh[++newStartIdx];
+            } else if (sameVnode(oldEndVnode, newEndVnode, oldEndIdx, newEndIdx)) {
+                updated = this.patchItem(oldEndVnode, newEndVnode, oldEndIdx) || updated;
+                oldEndVnode = oldCh[--oldEndIdx];
+                newEndVnode = newCh[--newEndIdx];
+            } else if (sameVnode(oldStartVnode, newEndVnode)) {
+                updated = this.patchItem(oldStartVnode, newEndVnode, oldStartIdx) || updated;
+                insertBefore(oldStartVnode, oldEndVnode, true);
+                oldStartVnode = oldCh[++oldStartIdx];
+                newEndVnode = newCh[--newEndIdx];
+            } else if (sameVnode(oldEndVnode, newStartVnode)) {
+                updated = this.patchItem(oldEndVnode, newStartVnode, oldEndIdx) || updated;
+                insertBefore(oldEndVnode, oldStartVnode);
+                oldEndVnode = oldCh[--oldEndIdx];
+                newStartVnode = newCh[++newStartIdx];
+            } else {
+                var node = addNode(newStartVnode);
+                insertBefore(node, oldStartVnode);
+                newStartVnode = newCh[++newStartIdx];
+            }
+        }
+        if (oldStartIdx > oldEndIdx) {
+            before = BI.isNull(newCh[newEndIdx + 1]) ? null : newCh[newEndIdx + 1].elm;
+            addVnodes(before, newCh, newStartIdx, newEndIdx);
+        } else if (newStartIdx > newEndIdx) {
+            removeVnodes(oldCh, oldStartIdx, oldEndIdx);
+        }
+
+        this._children = {};
+        BI.each(newCh, function (i, child) {
+            var node = self._getOptions(child);
+            var key = node.key == null ? i : node.key;
+            children[key]._mount();
+            self._children[self._getChildName(i)] = children[key];
+        });
+
+        function sameVnode(vnode1, vnode2, oldIndex, newIndex) {
+            vnode1 = self._getOptions(vnode1);
+            vnode2 = self._getOptions(vnode2);
+            if (BI.isKey(vnode1.key)) {
+                return vnode1.key === vnode2.key;
+            }
+            if (oldIndex >= 0) {
+                return oldIndex === newIndex
+            }
+        }
+
+        function addNode(vnode, index) {
+            var opt = self._getOptions(vnode);
+            var key = opt.key == null ? index : opt.key;
+            return children[key] = self._addElement(key, vnode);
+        }
+
+        function addVnodes(before, vnodes, startIdx, endIdx) {
+            for (; startIdx <= endIdx; ++startIdx) {
+                var node = addNode(vnodes[startIdx], startIdx);
+                insertBefore(node, before, false, startIdx);
             }
         }
+
+        function removeVnodes(vnodes, startIdx, endIdx) {
+            for (; startIdx <= endIdx; ++startIdx) {
+                var node = self._getOptions(vnodes[startIdx]);
+                var key = node.key == null ? startIdx : node.key;
+                children[key]._destroy();
+            }
+        }
+
+        function insertBefore(insert, before, isNext, index) {
+            insert = self._getOptions(insert);
+            before = before && self._getOptions(before);
+            var insertKey = BI.isKey(insert.key) ? insert.key : index;
+            if (before && children[before.key]) {
+                var beforeKey = BI.isKey(before.key) ? before.key : index;
+                var next;
+                if (isNext) {
+                    next = children[beforeKey].element.next();
+                } else {
+                    next = children[beforeKey].element;
+                }
+                if (next.length > 0) {
+                    next.before(children[insertKey].element);
+                } else {
+                    self._getWrapper().append(children[insertKey].element);
+                }
+            } else {
+                self._getWrapper().append(children[insertKey].element);
+            }
+        }
+
+        return updated;
+    },
+
+    update: function (opt) {
+        var o = this.options;
+        var items = opt.items || [];
+        var updated = this.updateChildren(o.items, items);
+        this.options.items = items;
         return updated;
+        // var updated, i, len;
+        // for (i = 0, len = Math.min(o.items.length, items.length); i < len; i++) {
+        //     if (!this._compare(o.items[i], items[i])) {
+        //         updated = this.updateItemAt(i, items[i]) || updated;
+        //     }
+        // }
+        // if (o.items.length > items.length) {
+        //     var deleted = [];
+        //     for (i = items.length; i < o.items.length; i++) {
+        //         deleted.push(this._children[this._getChildName(i)]);
+        //         delete this._children[this._getChildName(i)];
+        //     }
+        //     o.items.splice(items.length);
+        //     BI.each(deleted, function (i, w) {
+        //         w._destroy();
+        //     })
+        // } else if (items.length > o.items.length) {
+        //     for (i = o.items.length; i < items.length; i++) {
+        //         this.addItemAt(i, items[i]);
+        //     }
+        // }
+        // return updated;
     },
 
     stroke: function (items) {
@@ -22781,7 +22915,25 @@ BI.extend(jQuery, {
  */
 BI.Func = {};
 BI.extend(BI.Func, {
-
+    /**
+     * 创建唯一的名字
+     * @param array
+     * @param name
+     * @returns {*}
+     */
+    createDistinctName: function (array, name) {
+        var src = name, idx = 1;
+        name = name || "";
+        while (true) {
+            if (BI.every(array, function (i, item) {
+                    return item.name !== name;
+                })) {
+                break;
+            }
+            name = src + (idx++);
+        }
+        return name;
+    },
     /**
      * 获取搜索结果
      * @param items
@@ -27389,7 +27541,7 @@ BI.HorizontalLayout = BI.inherit(BI.Layout, {
     props: function () {
         return BI.extend(BI.HorizontalLayout.superclass.props.apply(this, arguments), {
             baseCls: "bi-horizontal-layout",
-            verticalAlign: "middle",
+            verticalAlign: BI.VerticalAlign.Top,
             columnSize: [],
             scrollx: true,
             hgap: 0,

dist/demo.css

@@ -88,3 +88,105 @@ body {
   font-size: 20px;
   font-weight: 300;
 }
+.mvc-button:hover,
+.mvc-button.hover {
+  opacity: 0.5;
+  filter: alpha(opacity=50);
+}
+.mvc-button.active,
+.mvc-button:active {
+  opacity: 0.5;
+  filter: alpha(opacity=50);
+}
+.bi-set-get .left-title,
+.bi-set-get .right-title {
+  background: #0088cc;
+  color: #ffffff;
+}
+.bi-set-get .left-nav {
+  border-bottom: 1px solid #cccccc;
+}
+.bi-set-get .left-nav.active,
+.bi-set-get .left-nav:active {
+  color: #ffffff;
+  background-color: #d9534f;
+}
+.bi-local .top-button {
+  background-color: #448eea;
+  color: #ffffff;
+}
+.bi-local .bottom-label {
+  background-color: #EA4738;
+  color: #ffffff;
+}
+.bi-local .delete-button {
+  background-color: #008B8B;
+  color: #ffffff;
+}
+.bi-local .vessel-border {
+  border-left: 1px solid #cccccc;
+  border-bottom: 1px solid #cccccc;
+  border-right: 1px solid #cccccc;
+}
+.bi-event .title {
+  background: #0088cc;
+  color: #ffffff;
+}
+.bi-event .front {
+  background: #ADD8E6;
+}
+.bi-event .nav {
+  border: 1px solid #cccccc;
+}
+.bi-skip-to {
+  color: #ffffff;
+}
+.bi-skip-to .red-pane {
+  background-color: #0088cc;
+}
+.bi-skip-to .blue-pane {
+  background-color: #6495ED;
+}
+.bi-skip-to .green-pane {
+  background-color: #008B8B;
+}
+.bi-skip-to .yellow-pane {
+  background-color: #B8860B;
+}
+.bi-change .outer-text {
+  background-color: #0088cc;
+  color: #ffffff;
+}
+.bi-change .inner {
+  border-left: 1px solid #cccccc;
+  border-bottom: 1px solid #cccccc;
+  border-right: 1px solid #cccccc;
+}
+.bi-change .type-first {
+  background-color: #008B8B;
+}
+.bi-change .type-second {
+  background-color: #6495ED;
+}
+.bi-change .type-third {
+  background-color: #0088cc;
+}
+.bi-tmp .tmp-button {
+  color: #ffffff;
+  background: #0088cc;
+}
+.bi-splice-duplicate .superiors-label {
+  color: white;
+  background-color: #008B8B;
+}
+.bi-splice-duplicate .sd-child {
+  border: 1px solid #cccccc;
+}
+.bi-splice-duplicate .sd-child .right-button-add {
+  color: white;
+  background-color: #0088cc;
+}
+.bi-splice-duplicate .sd-child .right-button-del {
+  color: white;
+  background-color: #d9534f;
+}

dist/sliders.js

@@ -1451,6 +1451,7 @@ BI.SingleSlider = BI.inherit(BI.Widget, {
         this.min = 0;
         this.max = 0;
         this._setBlueTrack(0);
+        
     },
 
     populate: function () {
@@ -1485,7 +1486,7 @@ BI.SingleSliderLabel = BI.inherit(BI.Widget, {
     _defaultConfig: function () {
         return BI.extend(BI.SingleSliderLabel.superclass._defaultConfig.apply(this, arguments), {
             baseCls: "bi-single-slider-label bi-slider-track",
-            digit: "",
+            digit: false,
             unit: ""
         });
     },
@@ -1493,7 +1494,6 @@ BI.SingleSliderLabel = BI.inherit(BI.Widget, {
         BI.SingleSliderLabel.superclass._init.apply(this, arguments);
 
         var self = this, o = this.options;
-        var digitExist = (o.digit === "") ? false : true;
         var c = this._constant;
         this.enable = false;
         this.value = "";
@@ -1523,7 +1523,7 @@ BI.SingleSliderLabel = BI.inherit(BI.Widget, {
                 self._setBlueTrack(significantPercent);
                 self._setLabelPosition(significantPercent);
                 var v = self._getValueByPercent(significantPercent);
-                v = digitExist ? v.toFixed(o.digit) : v;
+                v = o.digit === false ? v : v.toFixed(o.digit);
                 self.label.setText(v + o.unit);
                 self.value = v;
                 self.fireEvent(BI.SingleSliderLabel.EVENT_CHANGE);
@@ -1561,7 +1561,7 @@ BI.SingleSliderLabel = BI.inherit(BI.Widget, {
                 var significantPercent = BI.parseFloat(percent.toFixed(1));
                 self._setAllPosition(significantPercent);
                 var v = self._getValueByPercent(significantPercent);
-                v = digitExist ? v.toFixed(o.digit) : v;
+                v = o.digit === false ? v : v.toFixed(o.digit);
                 self.label.setText(v + o.unit);
                 self.value = v;
                 self.fireEvent(BI.SingleSliderLabel.EVENT_CHANGE);
@@ -1692,17 +1692,16 @@ BI.SingleSliderLabel = BI.inherit(BI.Widget, {
 
     setValue: function (v) {
         var o = this.options;
-        var digitExist = (o.digit === "") ? false : true;
+        v = BI.parseFloat(v);
-        var value = BI.parseFloat(v);
+        v = o.digit === false ? v : v.toFixed(o.digit);
-        value = digitExist ? value.toFixed(o.digit) : value;
+        if ((!isNaN(v))) {
-        if ((!isNaN(value))) {
+            if (this._checkValidation(v)) {
-            if (this._checkValidation(value)) {
+                this.value = v;
-                this.value = value;
             }
-            if (value > this.max) {
+            if (v > this.max) {
                 this.value = this.max;
             }
-            if (value < this.min) {
+            if (v < this.min) {
                 this.value = this.min;
             }
         }
@@ -1862,7 +1861,7 @@ BI.SingleSliderNormal = BI.inherit(BI.Widget, {
         });
         this.blueTrack = BI.createWidget({
             type: "bi.layout",
-            cls: "blue-track",
+            cls: "blue-track bi-high-light-background",
             height: 6
         });
         if (this.options.color) {

dist/widget.js

@@ -5932,9 +5932,9 @@ BI.MonthTrigger = BI.inherit(BI.Trigger, {
             this.editor.setTitle(v + 1);
             return;
         }
-        this.editor.setState();
+        this.editor.setState("");
-        this.editor.setValue();
+        this.editor.setValue("");
-        this.editor.setTitle();
+        this.editor.setTitle("");
     },
     getKey: function () {
         return this.editor.getValue() | 0;
@@ -10041,9 +10041,11 @@ BI.MultiSelectList = BI.inherit(BI.Widget, {
             cls: "popup-multi-select-list bi-border-left bi-border-right bi-border-bottom",
             itemsCreator: o.itemsCreator,
             valueFormatter: o.valueFormatter,
+            logic: {
+                dynamic: false
+            },
             // onLoaded: o.onLoaded,
             el: {
-                height: ""
             }
         });
         this.adapter.on(BI.MultiSelectLoader.EVENT_CHANGE, function () {
@@ -13385,6 +13387,7 @@ BI.QuarterTrigger = BI.inherit(BI.Trigger, {
     },
 
     setValue: function (v) {
+        v = v || "";
         this.editor.setState(v);
         this.editor.setValue(v);
         this.editor.setTitle(v);
@@ -16022,7 +16025,7 @@ BI.YearCombo = BI.inherit(BI.Widget, {
     },
 
     setValue: function (v) {
-        this.combo.setValue(v);
+        this.combo.setValue(v || "");
     },
 
     getValue: function () {

src/addons/sliders/js/singleslider/singleslider.label.js

@@ -14,7 +14,7 @@ BI.SingleSliderLabel = BI.inherit(BI.Widget, {
     _defaultConfig: function () {
         return BI.extend(BI.SingleSliderLabel.superclass._defaultConfig.apply(this, arguments), {
             baseCls: "bi-single-slider-label bi-slider-track",
-            digit: "",
+            digit: false,
             unit: ""
         });
     },
@@ -22,7 +22,6 @@ BI.SingleSliderLabel = BI.inherit(BI.Widget, {
         BI.SingleSliderLabel.superclass._init.apply(this, arguments);
 
         var self = this, o = this.options;
-        var digitExist = (o.digit === "") ? false : true;
         var c = this._constant;
         this.enable = false;
         this.value = "";
@@ -52,7 +51,7 @@ BI.SingleSliderLabel = BI.inherit(BI.Widget, {
                 self._setBlueTrack(significantPercent);
                 self._setLabelPosition(significantPercent);
                 var v = self._getValueByPercent(significantPercent);
-                v = digitExist ? v.toFixed(o.digit) : v;
+                v = o.digit === false ? v : v.toFixed(o.digit);
                 self.label.setText(v + o.unit);
                 self.value = v;
                 self.fireEvent(BI.SingleSliderLabel.EVENT_CHANGE);
@@ -90,7 +89,7 @@ BI.SingleSliderLabel = BI.inherit(BI.Widget, {
                 var significantPercent = BI.parseFloat(percent.toFixed(1));
                 self._setAllPosition(significantPercent);
                 var v = self._getValueByPercent(significantPercent);
-                v = digitExist ? v.toFixed(o.digit) : v;
+                v = o.digit === false ? v : v.toFixed(o.digit);
                 self.label.setText(v + o.unit);
                 self.value = v;
                 self.fireEvent(BI.SingleSliderLabel.EVENT_CHANGE);
@@ -221,17 +220,16 @@ BI.SingleSliderLabel = BI.inherit(BI.Widget, {
 
     setValue: function (v) {
         var o = this.options;
-        var digitExist = (o.digit === "") ? false : true;
+        v = BI.parseFloat(v);
-        var value = BI.parseFloat(v);
+        v = o.digit === false ? v : v.toFixed(o.digit);
-        value = digitExist ? value.toFixed(o.digit) : value;
+        if ((!isNaN(v))) {
-        if ((!isNaN(value))) {
+            if (this._checkValidation(v)) {
-            if (this._checkValidation(value)) {
+                this.value = v;
-                this.value = value;
             }
-            if (value > this.max) {
+            if (v > this.max) {
                 this.value = this.max;
             }
-            if (value < this.min) {
+            if (v < this.min) {
                 this.value = this.min;
             }
         }

src/addons/sliders/js/singleslider/singleslider.normal.js

@@ -118,7 +118,7 @@ BI.SingleSliderNormal = BI.inherit(BI.Widget, {
         });
         this.blueTrack = BI.createWidget({
             type: "bi.layout",
-            cls: "blue-track",
+            cls: "blue-track bi-high-light-background",
             height: 6
         });
         if (this.options.color) {

src/base/combination/group.virtual.js

@@ -56,17 +56,13 @@ BI.VirtualGroup = BI.inherit(BI.Widget, {
     },
 
     setValue: function (v) {
-        this.layouts.setValue(v);
+        // this.layouts.setValue(v);
     },
 
     getValue: function () {
         return this.layouts.getValue();
     },
 
-    empty: function () {
-        this.layouts.empty();
-    },
-
     populate: function (items) {
         var self = this;
         items = items || [];

src/base/richeditor/bar/action.richeditor.param.js

@@ -26,9 +26,11 @@ BI.RichEditorParamAction = BI.inherit(BI.RichEditorAction, {
         var instance = o.editor.selectedInstance;
         var next = $param.next();
         if (next.length === 0 || this._isParam(next)) {
-            var node = this._createBlankNode();
+            var preNode = this._createBlankNode();
-            $param.after(node);
+            var nextNode = this._createBlankNode();
-            instance.setFocus(node[0]);
+            $param.before(preNode);
+            $param.after(nextNode);
+            instance.setFocus(nextNode[0]);
         } else {
             instance.setFocus(next[0]);
         }

src/base/richeditor/niceditor/niceditor.js

@@ -121,7 +121,7 @@
         start: function () {
             this.elm.element.attr("contentEditable", true);
             if (this.getContent() == "") {
-                this.setContent("<br />");
+                // this.setContent("<br />");
             }
             this.instanceDoc = document.defaultView;
             this.elm.element.on('mousedown', BI.bind(this.selected, this));

src/core/func/function.js

@@ -4,7 +4,25 @@
  */
 BI.Func = {};
 BI.extend(BI.Func, {
-
+    /**
+     * 创建唯一的名字
+     * @param array
+     * @param name
+     * @returns {*}
+     */
+    createDistinctName: function (array, name) {
+        var src = name, idx = 1;
+        name = name || "";
+        while (true) {
+            if (BI.every(array, function (i, item) {
+                    return item.name !== name;
+                })) {
+                break;
+            }
+            name = src + (idx++);
+        }
+        return name;
+    },
     /**
      * 获取搜索结果
      * @param items

src/core/mvc/fbi.js

@@ -1131,9 +1131,6 @@
         // manipulation API.
         _removeElement: function () {
             this.$el.remove();
-            if ($.browser.msie === true) {
-                this.el.outerHTML = '';
-            }
         },
 
         // Change the view's element (`this.el` property) and re-delegate the
@@ -1174,7 +1171,7 @@
         // alternative DOM manipulation API and are only required to set the
         // `this.el` property.
         _setElement: function (el) {
-            this.$el = el instanceof BI.$ ? el : BI.$(el);
+            this.$el = el instanceof BI.$ ? el : (BI.isWidget(el) ? el.element : BI.$(el));
             this.element = this.$el;
             this.el = this.$el[0];
         },
@@ -1585,8 +1582,8 @@
 
             // Add a cross-platform `addEventListener` shim for older browsers.
             var addEventListener = window.addEventListener || function (eventName, listener) {
-                    return attachEvent('on' + eventName, listener);
+                return attachEvent('on' + eventName, listener);
-                };
+            };
 
             // Depending on whether we're using pushState or hashes, and whether
             // 'onhashchange' is supported, determine how we check the URL state.
@@ -1606,8 +1603,8 @@
         stop: function () {
             // Add a cross-platform `removeEventListener` shim for older browsers.
             var removeEventListener = window.removeEventListener || function (eventName, listener) {
-                    return detachEvent('on' + eventName, listener);
+                return detachEvent('on' + eventName, listener);
-                };
+            };
 
             // Remove window listeners.
             if (this._hasPushState) {

src/core/shortcut.js

@@ -13,8 +13,7 @@
             return new (new Function('return ' + config['classType'] + ';')())(config);
         }
 
-        var xtype = config.type.toLowerCase();
+        var cls = kv[config.type];
-        var cls = kv[xtype];
         return new cls(config);
     };
 

src/core/utils/tree.js

@@ -365,7 +365,7 @@
             }
             child.setParent(this);
             if (cur >= 0) {
-                this.getChild(cur).setRight(child);
+                this.getChild(cur) && this.getChild(cur).setRight(child);
                 child.setLeft(this.getChild(cur));
             }
             if (BI.isUndefined(index)) {

src/core/view.js

@@ -183,8 +183,8 @@ BI.View = BI.inherit(BI.V, {
         return this;
     },
 
-    createView: function (url, modelData, viewData) {
+    createView: function (url, modelData, viewData, context) {
-        return BI.Factory.createView(url, this.get(url), modelData, viewData);
+        return BI.Factory.createView(url, this.get(url), modelData, viewData, context);
     },
 
     /**
@@ -222,7 +222,7 @@ BI.View = BI.inherit(BI.V, {
         }
         cardLayout.setVisible(true);
         if (BI.isKey(cardName) && !cardLayout.isCardExisted(cardName)) {
-            var view = this.createView(this.rootURL + "/" + cardName, data, viewData);
+            var view = this.createView(this.rootURL + "/" + cardName, data, viewData, this);
             isValid && this.model.addChild(modelData, view.model);
             view.listenTo(view.model, "destroy", function () {
                 delete self._cards[cardName];
@@ -348,6 +348,7 @@ BI.View = BI.inherit(BI.V, {
                 success && success(data, model);
             }
         }));
+
         function callback(data) {
             self.model.load(data);
             self.load(data);
@@ -526,3 +527,10 @@ BI.View = BI.inherit(BI.V, {
         this.off();
     }
 });
+
+BI.View.registerVMRouter = function (viewRouter, modelRouter) {
+    //配置View
+    BI.View.createView = BI.View.prototype.createView = function (url, modelData, viewData, context) {
+        return BI.Factory.createView(url, viewRouter.get(url), _.extend({}, modelRouter.get(url), modelData), viewData || {}, context);
+    };
+};

src/core/widget.js

@@ -407,7 +407,7 @@ BI.Widget = BI.inherit(BI.OB, {
     __d: function () {
         this.beforeDestroy && this.beforeDestroy();
         BI.each(this._children, function (i, widget) {
-            widget._unMount && widget._unMount();
+            widget && widget._unMount && widget._unMount();
         });
         this._children = {};
         this._parent = null;
@@ -430,7 +430,7 @@ BI.Widget = BI.inherit(BI.OB, {
 
     empty: function () {
         BI.each(this._children, function (i, widget) {
-            widget._unMount && widget._unMount();
+            widget && widget._unMount && widget._unMount();
         });
         this._children = {};
         this.element.empty();

src/core/wrapper/layout.js

@@ -347,31 +347,161 @@ BI.Layout = BI.inherit(BI.Widget, {
         })
     },
 
-    update: function (item) {
+    patchItem: function (oldVnode, vnode, index) {
-        var o = this.options;
+        if (!this._compare(oldVnode, vnode)) {
-        var items = item.items || [];
+            return this.updateItemAt(index, vnode);
-        var updated, i, len;
+        }
-        for (i = 0, len = Math.min(o.items.length, items.length); i < len; i++) {
+    },
-            if (!this._compare(o.items[i], items[i])) {
+
-                updated = this.updateItemAt(i, items[i]) || updated;
+    updateChildren: function (oldCh, newCh) {
+        var self = this;
+        var oldStartIdx = 0, newStartIdx = 0;
+        var oldEndIdx = oldCh.length - 1;
+        var oldStartVnode = oldCh[0];
+        var oldEndVnode = oldCh[oldEndIdx];
+        var newEndIdx = newCh.length - 1;
+        var newStartVnode = newCh[0];
+        var newEndVnode = newCh[newEndIdx];
+        var before;
+        var updated;
+        var children = {};
+        BI.each(oldCh, function (i, child) {
+            child = self._getOptions(child);
+            var key = child.key == null ? i : child.key;
+            if (BI.isKey(key)) {
+                children[key] = self._children[self._getChildName(i)];
+            }
+        });
+
+        while (oldStartIdx <= oldEndIdx && newStartIdx <= newEndIdx) {
+            if (BI.isNull(oldStartVnode)) {
+                oldStartVnode = oldCh[++oldStartIdx];
+            } else if (BI.isNull(oldEndVnode)) {
+                oldEndVnode = oldCh[--oldEndIdx];
+            } else if (sameVnode(oldStartVnode, newStartVnode, oldStartIdx, newStartIdx)) {
+                updated = this.patchItem(oldStartVnode, newStartVnode, oldStartIdx) || updated;
+                oldStartVnode = oldCh[++oldStartIdx];
+                newStartVnode = newCh[++newStartIdx];
+            } else if (sameVnode(oldEndVnode, newEndVnode, oldEndIdx, newEndIdx)) {
+                updated = this.patchItem(oldEndVnode, newEndVnode, oldEndIdx) || updated;
+                oldEndVnode = oldCh[--oldEndIdx];
+                newEndVnode = newCh[--newEndIdx];
+            } else if (sameVnode(oldStartVnode, newEndVnode)) {
+                updated = this.patchItem(oldStartVnode, newEndVnode, oldStartIdx) || updated;
+                insertBefore(oldStartVnode, oldEndVnode, true);
+                oldStartVnode = oldCh[++oldStartIdx];
+                newEndVnode = newCh[--newEndIdx];
+            } else if (sameVnode(oldEndVnode, newStartVnode)) {
+                updated = this.patchItem(oldEndVnode, newStartVnode, oldEndIdx) || updated;
+                insertBefore(oldEndVnode, oldStartVnode);
+                oldEndVnode = oldCh[--oldEndIdx];
+                newStartVnode = newCh[++newStartIdx];
+            } else {
+                var node = addNode(newStartVnode);
+                insertBefore(node, oldStartVnode);
+                newStartVnode = newCh[++newStartIdx];
             }
         }
-        if (o.items.length > items.length) {
+        if (oldStartIdx > oldEndIdx) {
-            var deleted = [];
+            before = BI.isNull(newCh[newEndIdx + 1]) ? null : newCh[newEndIdx + 1].elm;
-            for (i = items.length; i < o.items.length; i++) {
+            addVnodes(before, newCh, newStartIdx, newEndIdx);
-                deleted.push(this._children[this._getChildName(i)]);
+        } else if (newStartIdx > newEndIdx) {
-                delete this._children[this._getChildName(i)];
+            removeVnodes(oldCh, oldStartIdx, oldEndIdx);
+        }
+
+        this._children = {};
+        BI.each(newCh, function (i, child) {
+            var node = self._getOptions(child);
+            var key = node.key == null ? i : node.key;
+            children[key]._mount();
+            self._children[self._getChildName(i)] = children[key];
+        });
+
+        function sameVnode(vnode1, vnode2, oldIndex, newIndex) {
+            vnode1 = self._getOptions(vnode1);
+            vnode2 = self._getOptions(vnode2);
+            if (BI.isKey(vnode1.key)) {
+                return vnode1.key === vnode2.key;
             }
-            o.items.splice(items.length);
+            if (oldIndex >= 0) {
-            BI.each(deleted, function (i, w) {
+                return oldIndex === newIndex
-                w._destroy();
-            })
-        } else if (items.length > o.items.length) {
-            for (i = o.items.length; i < items.length; i++) {
-                this.addItemAt(i, items[i]);
             }
         }
+
+        function addNode(vnode, index) {
+            var opt = self._getOptions(vnode);
+            var key = opt.key == null ? index : opt.key;
+            return children[key] = self._addElement(key, vnode);
+        }
+
+        function addVnodes(before, vnodes, startIdx, endIdx) {
+            for (; startIdx <= endIdx; ++startIdx) {
+                var node = addNode(vnodes[startIdx], startIdx);
+                insertBefore(node, before, false, startIdx);
+            }
+        }
+
+        function removeVnodes(vnodes, startIdx, endIdx) {
+            for (; startIdx <= endIdx; ++startIdx) {
+                var node = self._getOptions(vnodes[startIdx]);
+                var key = node.key == null ? startIdx : node.key;
+                children[key]._destroy();
+            }
+        }
+
+        function insertBefore(insert, before, isNext, index) {
+            insert = self._getOptions(insert);
+            before = before && self._getOptions(before);
+            var insertKey = BI.isKey(insert.key) ? insert.key : index;
+            if (before && children[before.key]) {
+                var beforeKey = BI.isKey(before.key) ? before.key : index;
+                var next;
+                if (isNext) {
+                    next = children[beforeKey].element.next();
+                } else {
+                    next = children[beforeKey].element;
+                }
+                if (next.length > 0) {
+                    next.before(children[insertKey].element);
+                } else {
+                    self._getWrapper().append(children[insertKey].element);
+                }
+            } else {
+                self._getWrapper().append(children[insertKey].element);
+            }
+        }
+
+        return updated;
+    },
+
+    update: function (opt) {
+        var o = this.options;
+        var items = opt.items || [];
+        var updated = this.updateChildren(o.items, items);
+        this.options.items = items;
         return updated;
+        // var updated, i, len;
+        // for (i = 0, len = Math.min(o.items.length, items.length); i < len; i++) {
+        //     if (!this._compare(o.items[i], items[i])) {
+        //         updated = this.updateItemAt(i, items[i]) || updated;
+        //     }
+        // }
+        // if (o.items.length > items.length) {
+        //     var deleted = [];
+        //     for (i = items.length; i < o.items.length; i++) {
+        //         deleted.push(this._children[this._getChildName(i)]);
+        //         delete this._children[this._getChildName(i)];
+        //     }
+        //     o.items.splice(items.length);
+        //     BI.each(deleted, function (i, w) {
+        //         w._destroy();
+        //     })
+        // } else if (items.length > o.items.length) {
+        //     for (i = o.items.length; i < items.length; i++) {
+        //         this.addItemAt(i, items[i]);
+        //     }
+        // }
+        // return updated;
     },
 
     stroke: function (items) {

src/core/wrapper/layout/layout.horizontal.js

@@ -7,7 +7,7 @@ BI.HorizontalLayout = BI.inherit(BI.Layout, {
     props: function () {
         return BI.extend(BI.HorizontalLayout.superclass.props.apply(this, arguments), {
             baseCls: "bi-horizontal-layout",
-            verticalAlign: "middle",
+            verticalAlign: BI.VerticalAlign.Top,
             columnSize: [],
             scrollx: true,
             hgap: 0,

src/widget/month/trigger.month.js

@@ -92,9 +92,9 @@ BI.MonthTrigger = BI.inherit(BI.Trigger, {
             this.editor.setTitle(v + 1);
             return;
         }
-        this.editor.setState();
+        this.editor.setState("");
-        this.editor.setValue();
+        this.editor.setValue("");
-        this.editor.setTitle();
+        this.editor.setTitle("");
     },
     getKey: function () {
         return this.editor.getValue() | 0;

src/widget/multiselectlist/multiselectlist.js

@@ -25,9 +25,11 @@ BI.MultiSelectList = BI.inherit(BI.Widget, {
             cls: "popup-multi-select-list bi-border-left bi-border-right bi-border-bottom",
             itemsCreator: o.itemsCreator,
             valueFormatter: o.valueFormatter,
+            logic: {
+                dynamic: false
+            },
             // onLoaded: o.onLoaded,
             el: {
-                height: ""
             }
         });
         this.adapter.on(BI.MultiSelectLoader.EVENT_CHANGE, function () {

src/widget/quarter/trigger.quarter.js

@@ -89,6 +89,7 @@ BI.QuarterTrigger = BI.inherit(BI.Trigger, {
     },
 
     setValue: function (v) {
+        v = v || "";
         this.editor.setState(v);
         this.editor.setValue(v);
         this.editor.setTitle(v);

src/widget/year/combo.year.js

@@ -91,7 +91,7 @@ BI.YearCombo = BI.inherit(BI.Widget, {
     },
 
     setValue: function (v) {
-        this.combo.setValue(v);
+        this.combo.setValue(v || "");
     },
 
     getValue: function () {