update

demo/js/addons/slider/demo.slider.js

@@ -2,24 +2,27 @@
  * Created by Urthur on 2017/9/4.
  */
 Demo.Slider = BI.inherit(BI.Widget, {
-    _props: {
+    props: {
-        baseCls: "demo-slider",
+            baseCls: "demo-slider",
-        min: 10,
+            width: 300,
-        max: 50
+            height: 50,
+            min: 0,
+            max: 100
     },
 
     render: function () {
+        var self = this, o = this.options;
         var singleSlider = BI.createWidget({
             type: "bi.single_slider",
             digit: 0,
-            width: 300,
+            width: o.width,
-            height: 50,
+            height: o.height,
             cls: "layout-bg-white"
         });
 
         singleSlider.setMinAndMax({
             min: 10,
-            max: 100
+            max: o.max
         });
 
         singleSlider.setValue(30);
@@ -28,43 +31,42 @@ Demo.Slider = BI.inherit(BI.Widget, {
             console.log(this.getValue());
         });
 
-        var singleSliderLabel = BI.createWidget({
-            type: "bi.single_slider_label",
-            height: 50,
-            width: 300,
-            digit: 0,
-            unit: "个",
-            cls: "layout-bg-white"
-        });
-        singleSliderLabel.setMinAndMax({
-            min: 0,
-            max: 100
-        });
-        singleSliderLabel.setValue(10);
-        singleSliderLabel.populate();
-
         var normalSingleSlider = BI.createWidget({
             type: "bi.single_slider_normal",
+            width: o.width,
             height: 30,
-            width: 300,
             cls: "layout-bg-white"
         });
         normalSingleSlider.setMinAndMax({
-            min: 0,
+            min: o.min,
-            max: 100
+            max: o.max
         });
         normalSingleSlider.setValue(10);
         normalSingleSlider.populate();
 
+        var singleSliderLabel = BI.createWidget({
+            type: "bi.single_slider_label",
+            width: o.width,
+            height: o.height,
+            digit: 0,
+            unit: "个",
+            cls: "layout-bg-white"
+        });
+        singleSliderLabel.setMinAndMax({
+            min: o.min,
+            max: o.max
+        });
+        singleSliderLabel.setValue(10);
+        singleSliderLabel.populate();
 
         var intervalSlider = BI.createWidget({
             type: "bi.interval_slider",
-            width: 300,
+            width: o.width,
             cls: "layout-bg-white"
         });
         intervalSlider.setMinAndMax({
-            min: 0,
+            min: o.min,
-            max: 120
+            max: o.max
         });
         intervalSlider.setValue({
             min: 10,
@@ -74,7 +76,7 @@ Demo.Slider = BI.inherit(BI.Widget, {
 
         var intervalSliderLabel = BI.createWidget({
             type: "bi.interval_slider_label",
-            width: 300,
+            width: o.width,
             unit: "个",
             cls: "layout-bg-white"
         });

dist/demo.js

@@ -13,24 +13,27 @@ $(function () {
  * Created by Urthur on 2017/9/4.
  */
 Demo.Slider = BI.inherit(BI.Widget, {
-    _props: {
+    props: {
-        baseCls: "demo-slider",
+            baseCls: "demo-slider",
-        min: 10,
+            width: 300,
-        max: 50
+            height: 50,
+            min: 0,
+            max: 100
     },
 
     render: function () {
+        var self = this, o = this.options;
         var singleSlider = BI.createWidget({
             type: "bi.single_slider",
             digit: 0,
-            width: 300,
+            width: o.width,
-            height: 50,
+            height: o.height,
             cls: "layout-bg-white"
         });
 
         singleSlider.setMinAndMax({
             min: 10,
-            max: 100
+            max: o.max
         });
 
         singleSlider.setValue(30);
@@ -39,43 +42,42 @@ Demo.Slider = BI.inherit(BI.Widget, {
             console.log(this.getValue());
         });
 
-        var singleSliderLabel = BI.createWidget({
-            type: "bi.single_slider_label",
-            height: 50,
-            width: 300,
-            digit: 0,
-            unit: "个",
-            cls: "layout-bg-white"
-        });
-        singleSliderLabel.setMinAndMax({
-            min: 0,
-            max: 100
-        });
-        singleSliderLabel.setValue(10);
-        singleSliderLabel.populate();
-
         var normalSingleSlider = BI.createWidget({
             type: "bi.single_slider_normal",
+            width: o.width,
             height: 30,
-            width: 300,
             cls: "layout-bg-white"
         });
         normalSingleSlider.setMinAndMax({
-            min: 0,
+            min: o.min,
-            max: 100
+            max: o.max
         });
         normalSingleSlider.setValue(10);
         normalSingleSlider.populate();
 
+        var singleSliderLabel = BI.createWidget({
+            type: "bi.single_slider_label",
+            width: o.width,
+            height: o.height,
+            digit: 0,
+            unit: "个",
+            cls: "layout-bg-white"
+        });
+        singleSliderLabel.setMinAndMax({
+            min: o.min,
+            max: o.max
+        });
+        singleSliderLabel.setValue(10);
+        singleSliderLabel.populate();
 
         var intervalSlider = BI.createWidget({
             type: "bi.interval_slider",
-            width: 300,
+            width: o.width,
             cls: "layout-bg-white"
         });
         intervalSlider.setMinAndMax({
-            min: 0,
+            min: o.min,
-            max: 120
+            max: o.max
         });
         intervalSlider.setValue({
             min: 10,
@@ -85,7 +87,7 @@ Demo.Slider = BI.inherit(BI.Widget, {
 
         var intervalSliderLabel = BI.createWidget({
             type: "bi.interval_slider_label",
-            width: 300,
+            width: o.width,
             unit: "个",
             cls: "layout-bg-white"
         });
@@ -2139,8 +2141,9 @@ BI.shortcut("demo.clipboard", Demo.Func);Demo.Func = BI.inherit(BI.Widget, {
             type: "bi.absolute",
             items: [{
                 el: {
-                    type: "bi.color_chooser_popup",
+                    type: "bi.color_chooser",
-                    cls: "bi-card"
+                    width: 30,
+                    height: 30
                 },
                 left: 100,
                 top: 250
@@ -2148,7 +2151,7 @@ BI.shortcut("demo.clipboard", Demo.Func);Demo.Func = BI.inherit(BI.Widget, {
         }
     }
 });
-BI.shortcut("demo.color_chooser_popup", Demo.Func);Demo.Func = BI.inherit(BI.Widget, {
+BI.shortcut("demo.color_chooser", Demo.Func);Demo.Func = BI.inherit(BI.Widget, {
     props: {
         baseCls: "demo-func"
     },
@@ -2158,9 +2161,8 @@ BI.shortcut("demo.color_chooser_popup", Demo.Func);Demo.Func = BI.inherit(BI.Wid
             type: "bi.absolute",
             items: [{
                 el: {
-                    type: "bi.color_chooser",
+                    type: "bi.color_chooser_popup",
-                    width: 30,
+                    cls: "bi-card"
-                    height: 30
                 },
                 left: 100,
                 top: 250
@@ -2168,7 +2170,7 @@ BI.shortcut("demo.color_chooser_popup", Demo.Func);Demo.Func = BI.inherit(BI.Wid
         }
     }
 });
-BI.shortcut("demo.color_chooser", Demo.Func);Demo.Func = BI.inherit(BI.Widget, {
+BI.shortcut("demo.color_chooser_popup", Demo.Func);Demo.Func = BI.inherit(BI.Widget, {
     props: {
         baseCls: "demo-func"
     },
@@ -5377,92 +5379,6 @@ Demo.COMPONENT_CONFIG = [{
     props: {
         baseCls: "demo-func"
     },
-
-    child: [{
-        type: "bi.combo_group",
-        el: {
-            type: "bi.icon_text_icon_item",
-            text: "2010年",
-            value: 2010,
-            height: 25,
-            iconCls: "close-ha-font"
-        },
-        children: [{
-            type: "bi.single_select_item",
-            height: 25,
-            text: "一月",
-            value: 11
-        }, {
-            type: "bi.icon_text_icon_item",
-            height: 25,
-            text: "二月",
-            value: 12,
-            children: [{type: "bi.single_select_item", text: "一号", value: 101, height: 25}]
-        }]
-    }, {
-        text: "2011年", value: 2011
-    }, {
-        text: "2012年", value: 2012, iconCls: "close-ha-font"
-    }, {
-        text: "2013年", value: 2013
-    }, {
-        text: "2014年", value: 2014, iconCls: "close-ha-font"
-    }, {
-        text: "2015年", value: 2015, iconCls: "close-ha-font"
-    }],
-
-    _createBottom: function () {
-        var childCombo = BI.createWidget({
-            type: "bi.combo",
-            el: {
-                type: "bi.text_button",
-                cls: "button-combo",
-                height: 30
-            },
-            popup: {
-                el: {
-                    type: "bi.button_tree",
-                    items: BI.createItems(BI.deepClone(this.child), {
-                        type: "bi.single_select_item",
-                        height: 25,
-                        handler: function (v) {
-
-                        }
-                    }),
-                    layouts: [{
-                        type: "bi.vertical"
-                    }]
-                }
-            },
-            width: 200
-        });
-        childCombo.setValue(BI.deepClone(this.child)[0].children[0].value);
-
-        return BI.createWidget({
-            type: "bi.left",
-            items: [childCombo],
-            hgap: 20,
-            vgap: 20
-        })
-    },
-
-    render: function () {
-        return {
-            type: "bi.grid",
-            columns: 1,
-            rows: 1,
-            items: [{
-                column: 0,
-                row: 0,
-                el: this._createBottom()
-            }]
-        }
-    }
-});
-BI.shortcut("demo.combo_group", Demo.Func);Demo.Func = BI.inherit(BI.Widget, {
-    props: {
-        baseCls: "demo-func"
-    },
     years: [{
         text: "2010年", value: 2010, iconCls: "close-ha-font"
     }, {
@@ -6117,6 +6033,92 @@ BI.shortcut("demo.combo2", Demo.Func);Demo.Func = BI.inherit(BI.Widget, {
     props: {
         baseCls: "demo-func"
     },
+
+    child: [{
+        type: "bi.combo_group",
+        el: {
+            type: "bi.icon_text_icon_item",
+            text: "2010年",
+            value: 2010,
+            height: 25,
+            iconCls: "close-ha-font"
+        },
+        children: [{
+            type: "bi.single_select_item",
+            height: 25,
+            text: "一月",
+            value: 11
+        }, {
+            type: "bi.icon_text_icon_item",
+            height: 25,
+            text: "二月",
+            value: 12,
+            children: [{type: "bi.single_select_item", text: "一号", value: 101, height: 25}]
+        }]
+    }, {
+        text: "2011年", value: 2011
+    }, {
+        text: "2012年", value: 2012, iconCls: "close-ha-font"
+    }, {
+        text: "2013年", value: 2013
+    }, {
+        text: "2014年", value: 2014, iconCls: "close-ha-font"
+    }, {
+        text: "2015年", value: 2015, iconCls: "close-ha-font"
+    }],
+
+    _createBottom: function () {
+        var childCombo = BI.createWidget({
+            type: "bi.combo",
+            el: {
+                type: "bi.text_button",
+                cls: "button-combo",
+                height: 30
+            },
+            popup: {
+                el: {
+                    type: "bi.button_tree",
+                    items: BI.createItems(BI.deepClone(this.child), {
+                        type: "bi.single_select_item",
+                        height: 25,
+                        handler: function (v) {
+
+                        }
+                    }),
+                    layouts: [{
+                        type: "bi.vertical"
+                    }]
+                }
+            },
+            width: 200
+        });
+        childCombo.setValue(BI.deepClone(this.child)[0].children[0].value);
+
+        return BI.createWidget({
+            type: "bi.left",
+            items: [childCombo],
+            hgap: 20,
+            vgap: 20
+        })
+    },
+
+    render: function () {
+        return {
+            type: "bi.grid",
+            columns: 1,
+            rows: 1,
+            items: [{
+                column: 0,
+                row: 0,
+                el: this._createBottom()
+            }]
+        }
+    }
+});
+BI.shortcut("demo.combo_group", Demo.Func);Demo.Func = BI.inherit(BI.Widget, {
+    props: {
+        baseCls: "demo-func"
+    },
     render: function () {
         return {
             type: "bi.vertical",
@@ -7079,24 +7081,7 @@ Demo.BorderLayout = BI.inherit(BI.Widget, {
         }
     }
 });
-BI.shortcut("demo.border", Demo.BorderLayout);Demo.CenterAdapt = BI.inherit(BI.Widget, {
+BI.shortcut("demo.border", Demo.BorderLayout);/**
-    props: {
-        baseCls: "demo-absolute"
-    },
-    render: function () {
-        return {
-            type: "bi.center_adapt",
-            items: [{
-                type: "bi.label",
-                text: "水平垂直居中",
-                width: 300,
-                height: 200,
-                cls: "layout-bg1"
-            }]
-        }
-    },
-});
-BI.shortcut("demo.center_adapt", Demo.CenterAdapt);/**
  * Created by User on 2017/3/22.
  */
 Demo.CenterLayout = BI.inherit(BI.Widget, {
@@ -7130,7 +7115,24 @@ Demo.CenterLayout = BI.inherit(BI.Widget, {
         }
     }
 });
-BI.shortcut("demo.center_layout", Demo.CenterLayout);/**
+BI.shortcut("demo.center_layout", Demo.CenterLayout);Demo.CenterAdapt = BI.inherit(BI.Widget, {
+    props: {
+        baseCls: "demo-absolute"
+    },
+    render: function () {
+        return {
+            type: "bi.center_adapt",
+            items: [{
+                type: "bi.label",
+                text: "水平垂直居中",
+                width: 300,
+                height: 200,
+                cls: "layout-bg1"
+            }]
+        }
+    },
+});
+BI.shortcut("demo.center_adapt", Demo.CenterAdapt);/**
  * Created by User on 2017/3/22.
  */
 Demo.FloatCenterLayout = BI.inherit(BI.Widget, {
@@ -7377,6 +7379,32 @@ Demo.GridLayout = BI.inherit(BI.Widget, {
     }
 });
 BI.shortcut("demo.grid", Demo.GridLayout);/**
+ * Created by User on 2017/3/21.
+ */
+Demo.Horizontal = BI.inherit(BI.Widget, {
+    props: {
+        baseCls: "demo-horizontal"
+    },
+    render: function () {
+        return {
+            type: "bi.horizontal",
+            items: [{
+                type: "bi.label",
+                text: "水平布局",
+                cls: "layout-bg3",
+                width: 300,
+                height: 30
+            }, {
+                type: "bi.label",
+                text: "水平布局",
+                cls: "layout-bg4",
+                width: 300,
+                height: 30
+            }]
+        }
+    }
+});
+BI.shortcut("demo.horizontal", Demo.Horizontal);/**
  * Created by User on 2017/3/22.
  */
 Demo.HorizontalAdapt = BI.inherit(BI.Widget, {
@@ -7493,32 +7521,6 @@ Demo.HorizontalFloat = BI.inherit(BI.Widget, {
     }
 });
 BI.shortcut("demo.horizontal_float", Demo.HorizontalFloat);/**
- * Created by User on 2017/3/21.
- */
-Demo.Horizontal = BI.inherit(BI.Widget, {
-    props: {
-        baseCls: "demo-horizontal"
-    },
-    render: function () {
-        return {
-            type: "bi.horizontal",
-            items: [{
-                type: "bi.label",
-                text: "水平布局",
-                cls: "layout-bg3",
-                width: 300,
-                height: 30
-            }, {
-                type: "bi.label",
-                text: "水平布局",
-                cls: "layout-bg4",
-                width: 300,
-                height: 30
-            }]
-        }
-    }
-});
-BI.shortcut("demo.horizontal", Demo.Horizontal);/**
  * Created by User on 2017/3/22.
  */
 Demo.HtapeLayout = BI.inherit(BI.Widget, {
@@ -7818,6 +7820,30 @@ Demo.TdLayout = BI.inherit(BI.Widget, {
     }
 });
 BI.shortcut("demo.td", Demo.TdLayout);/**
+ * Created by User on 2017/3/21.
+ */
+Demo.VerticalLayout = BI.inherit(BI.Widget, {
+    props: {
+        baseCls: "demo-vertical"
+    },
+    render: function () {
+        return {
+            type: "bi.vertical",
+            items: [{
+                type: "bi.label",
+                cls: "layout-bg3",
+                text: "垂直布局",
+                height: 30
+            }, {
+                type: "bi.label",
+                cls: "layout-bg4",
+                text: "垂直布局",
+                height: 30
+            }]
+        }
+    }
+});
+BI.shortcut("demo.vertical", Demo.VerticalLayout);/**
  * Created by User on 2017/3/22.
  */
 Demo.VerticalAdaptLayout = BI.inherit(BI.Widget, {
@@ -7859,30 +7885,6 @@ Demo.VerticalAdaptLayout = BI.inherit(BI.Widget, {
     }
 });
 BI.shortcut("demo.vertical_adapt", Demo.VerticalAdaptLayout);/**
- * Created by User on 2017/3/21.
- */
-Demo.VerticalLayout = BI.inherit(BI.Widget, {
-    props: {
-        baseCls: "demo-vertical"
-    },
-    render: function () {
-        return {
-            type: "bi.vertical",
-            items: [{
-                type: "bi.label",
-                cls: "layout-bg3",
-                text: "垂直布局",
-                height: 30
-            }, {
-                type: "bi.label",
-                cls: "layout-bg4",
-                text: "垂直布局",
-                height: 30
-            }]
-        }
-    }
-});
-BI.shortcut("demo.vertical", Demo.VerticalLayout);/**
  * Created by User on 2017/3/22.
  */
 Demo.VtapeLayout = BI.inherit(BI.Widget, {