From d43a9786e47db24724dbad74a354713170072693 Mon Sep 17 00:00:00 2001
From: zsmj <zsmj1994@gmail.com>
Date: Thu, 12 Jan 2023 16:13:17 +0800
Subject: [PATCH 1/4] update

---
 src/widget/index.js | 4 ++--
 1 file changed, 2 insertions(+), 2 deletions(-)

diff --git a/src/widget/index.js b/src/widget/index.js
index 327f708f8..5d238bd4f 100644
--- a/src/widget/index.js
+++ b/src/widget/index.js
@@ -44,7 +44,7 @@ export * from "./datepane";
 export * from "./datetime";
 export * from "./datetimepane";
 export * from "./dynamicdatetime";
-export * from "./time
+export * from "./time";
 export * from "./editor";
 export { SelectTreeCombo } from "./selecttree/selecttree.combo";
 export { SingleTreeCombo } from "./singletree/singletree.combo";
@@ -53,7 +53,7 @@ export { MultiTreeInsertCombo } from "./multitree/multi.tree.insert.combo";
 export { MultiTreeListCombo } from "./multitree/multi.tree.list.combo";
 export * from "./multiselect";
 export * from "./multiselectlist";
-              
+
 export {
     Collapse,
     NumberEditor,

From fb82d5c0273675fdc951df4dc82266033e6cce8b Mon Sep 17 00:00:00 2001
From: zsmj <zsmj1994@gmail.com>
Date: Thu, 12 Jan 2023 16:13:32 +0800
Subject: [PATCH 2/4] update

---
 src/core/1.lodash.js | 443 ++++++++++++++++++++++++-------------------
 1 file changed, 243 insertions(+), 200 deletions(-)

diff --git a/src/core/1.lodash.js b/src/core/1.lodash.js
index 1fdf1bbc4..269718d61 100644
--- a/src/core/1.lodash.js
+++ b/src/core/1.lodash.js
@@ -1,3 +1,4 @@
+/* eslint-disable */
 /**
  * @license
  * Lodash (Custom Build) <https://lodash.com/>
@@ -7,7 +8,7 @@
  * Based on Underscore.js 1.8.3 <http://underscorejs.org/LICENSE>
  * Copyright Jeremy Ashkenas, DocumentCloud and Investigative Reporters & Editors
  */
-;(function() {
+;(function () {
 
     /** Used as a safe reference for `undefined` in pre-ES5 environments. */
     var undefined;
@@ -191,7 +192,7 @@
     var reUnicode = RegExp(rsFitz + '(?=' + rsFitz + ')|' + rsSymbol + rsSeq, 'g');
 
     /** Used to detect strings with [zero-width joiners or code points from the astral planes](http://eev.ee/blog/2015/09/12/dark-corners-of-unicode/). */
-    var reHasUnicode = RegExp('[' + rsZWJ + rsAstralRange  + rsComboRange + rsVarRange + ']');
+    var reHasUnicode = RegExp('[' + rsZWJ + rsAstralRange + rsComboRange + rsVarRange + ']');
 
     /** Used to identify `toStringTag` values of typed arrays. */
     var typedArrayTags = {};
@@ -269,10 +270,11 @@
     var freeProcess = moduleExports && freeGlobal.process;
 
     /** Used to access faster Node.js helpers. */
-    var nodeUtil = (function() {
+    var nodeUtil = (function () {
         try {
             return freeProcess && freeProcess.binding && freeProcess.binding('util');
-        } catch (e) {}
+        } catch (e) {
+        }
     }());
 
     /* Node.js helper references. */
@@ -296,10 +298,14 @@
      */
     function apply(func, thisArg, args) {
         switch (args.length) {
-            case 0: return func.call(thisArg);
-            case 1: return func.call(thisArg, args[0]);
-            case 2: return func.call(thisArg, args[0], args[1]);
-            case 3: return func.call(thisArg, args[0], args[1], args[2]);
+            case 0:
+                return func.call(thisArg);
+            case 1:
+                return func.call(thisArg, args[0]);
+            case 2:
+                return func.call(thisArg, args[0], args[1]);
+            case 3:
+                return func.call(thisArg, args[0], args[1], args[2]);
         }
         return func.apply(thisArg, args);
     }
@@ -546,7 +552,7 @@
      */
     function baseFindKey(collection, predicate, eachFunc) {
         var result;
-        eachFunc(collection, function(value, key, collection) {
+        eachFunc(collection, function (value, key, collection) {
             if (predicate(value, key, collection)) {
                 result = key;
                 return false;
@@ -612,7 +618,7 @@
      * @returns {Function} Returns the new accessor function.
      */
     function baseProperty(key) {
-        return function(object) {
+        return function (object) {
             return object == null ? undefined : object[key];
         };
     }
@@ -625,7 +631,7 @@
      * @returns {Function} Returns the new accessor function.
      */
     function basePropertyOf(object) {
-        return function(key) {
+        return function (key) {
             return object == null ? undefined : object[key];
         };
     }
@@ -644,7 +650,7 @@
      * @returns {*} Returns the accumulated value.
      */
     function baseReduce(collection, iteratee, accumulator, initAccum, eachFunc) {
-        eachFunc(collection, function(value, index, collection) {
+        eachFunc(collection, function (value, index, collection) {
             accumulator = initAccum
                 ? (initAccum = false, value)
                 : iteratee(accumulator, value, index, collection);
@@ -699,7 +705,7 @@
      * @returns {Function} Returns the new capped function.
      */
     function baseUnary(func) {
-        return function(value) {
+        return function (value) {
             return func(value);
         };
     }
@@ -715,7 +721,7 @@
      * @returns {Object} Returns the array of property values.
      */
     function baseValues(object, props) {
-        return arrayMap(props, function(key) {
+        return arrayMap(props, function (key) {
             return object[key];
         });
     }
@@ -745,7 +751,8 @@
         var index = -1,
             length = strSymbols.length;
 
-        while (++index < length && baseIndexOf(chrSymbols, strSymbols[index], 0) > -1) {}
+        while (++index < length && baseIndexOf(chrSymbols, strSymbols[index], 0) > -1) {
+        }
         return index;
     }
 
@@ -761,7 +768,8 @@
     function charsEndIndex(strSymbols, chrSymbols) {
         var index = strSymbols.length;
 
-        while (index-- && baseIndexOf(chrSymbols, strSymbols[index], 0) > -1) {}
+        while (index-- && baseIndexOf(chrSymbols, strSymbols[index], 0) > -1) {
+        }
         return index;
     }
 
@@ -845,7 +853,7 @@
         var index = -1,
             result = Array(map.size);
 
-        map.forEach(function(value, key) {
+        map.forEach(function (value, key) {
             result[++index] = [key, value];
         });
         return result;
@@ -860,7 +868,7 @@
      * @returns {Function} Returns the new function.
      */
     function overArg(func, transform) {
-        return function(arg) {
+        return function (arg) {
             return func(transform(arg));
         };
     }
@@ -915,7 +923,7 @@
         var index = -1,
             result = Array(set.size);
 
-        set.forEach(function(value) {
+        set.forEach(function (value) {
             result[++index] = value;
         });
         return result;
@@ -1024,7 +1032,7 @@
     var idCounter = 0;
 
     /** Used to detect methods masquerading as native. */
-    var maskSrcKey = (function() {
+    var maskSrcKey = (function () {
         var uid = /[^.]+$/.exec(coreJsData && coreJsData.keys && coreJsData.keys.IE_PROTO || '');
         return uid ? ('Symbol(src)_1.' + uid) : '';
     }());
@@ -1061,12 +1069,13 @@
         symIterator = Symbol ? Symbol.iterator : undefined,
         symToStringTag = Symbol ? Symbol.toStringTag : undefined;
 
-    var defineProperty = (function() {
+    var defineProperty = (function () {
         try {
             var func = getNative(Object, 'defineProperty');
             func({}, '', {});
             return func;
-        } catch (e) {}
+        } catch (e) {
+        }
     }());
 
     /* Built-in method references for those with the same name as other `lodash` methods. */
@@ -1247,9 +1256,11 @@
      * @param {Object} proto The object to inherit from.
      * @returns {Object} Returns the new object.
      */
-    var baseCreate = (function() {
-        function object() {}
-        return function(proto) {
+    var baseCreate = (function () {
+        function object() {
+        }
+
+        return function (proto) {
             if (!isObject(proto)) {
                 return {};
             }
@@ -1992,7 +2003,7 @@
      * @returns {Function} Returns `accumulator`.
      */
     function baseAggregator(collection, setter, iteratee, accumulator) {
-        baseEach(collection, function(value, key, collection) {
+        baseEach(collection, function (value, key, collection) {
             setter(accumulator, value, iteratee(value), collection);
         });
         return accumulator;
@@ -2154,7 +2165,7 @@
         stack.set(value, result);
 
         if (isSet(value)) {
-            value.forEach(function(subValue) {
+            value.forEach(function (subValue) {
                 result.add(baseClone(subValue, bitmask, customizer, subValue, value, stack));
             });
 
@@ -2162,7 +2173,7 @@
         }
 
         if (isMap(value)) {
-            value.forEach(function(subValue, key) {
+            value.forEach(function (subValue, key) {
                 result.set(key, baseClone(subValue, bitmask, customizer, key, value, stack));
             });
 
@@ -2174,7 +2185,7 @@
             : (isFlat ? keysIn : keys);
 
         var props = isArr ? undefined : keysFunc(value);
-        arrayEach(props || value, function(subValue, key) {
+        arrayEach(props || value, function (subValue, key) {
             if (props) {
                 key = subValue;
                 subValue = value[key];
@@ -2199,7 +2210,9 @@
         if (typeof func != 'function') {
             throw new TypeError(FUNC_ERROR_TEXT);
         }
-        return setTimeout(function() { func.apply(undefined, args); }, wait);
+        return setTimeout(function () {
+            func.apply(undefined, args);
+        }, wait);
     }
 
     /**
@@ -2230,8 +2243,7 @@
         if (comparator) {
             includes = arrayIncludesWith;
             isCommon = false;
-        }
-        else if (values.length >= LARGE_ARRAY_SIZE) {
+        } else if (values.length >= LARGE_ARRAY_SIZE) {
             includes = cacheHas;
             isCommon = false;
             values = new SetCache(values);
@@ -2250,8 +2262,7 @@
                         }
                     }
                     result.push(value);
-                }
-                else if (!includes(values, computed, comparator)) {
+                } else if (!includes(values, computed, comparator)) {
                     result.push(value);
                 }
             }
@@ -2279,7 +2290,7 @@
      */
     function baseEvery(collection, predicate) {
         var result = true;
-        baseEach(collection, function(value, index, collection) {
+        baseEach(collection, function (value, index, collection) {
             result = !!predicate(value, index, collection);
             return result;
         });
@@ -2325,7 +2336,7 @@
      */
     function baseFilter(collection, predicate) {
         var result = [];
-        baseEach(collection, function(value, index, collection) {
+        baseEach(collection, function (value, index, collection) {
             if (predicate(value, index, collection)) {
                 result.push(value);
             }
@@ -2426,7 +2437,7 @@
      * @returns {Array} Returns the function names.
      */
     function baseFunctions(object, props) {
-        return arrayFilter(props, function(key) {
+        return arrayFilter(props, function (key) {
             return isFunction(object[key]);
         });
     }
@@ -2595,7 +2606,7 @@
      * @returns {Function} Returns `accumulator`.
      */
     function baseInverter(object, setter, iteratee, accumulator) {
-        baseForOwn(object, function(value, key, object) {
+        baseForOwn(object, function (value, key, object) {
             setter(accumulator, iteratee(value), key, object);
         });
         return accumulator;
@@ -2929,7 +2940,7 @@
         var index = -1,
             result = isArrayLike(collection) ? Array(collection.length) : [];
 
-        baseEach(collection, function(value, key, collection) {
+        baseEach(collection, function (value, key, collection) {
             result[++index] = iteratee(value, key, collection);
         });
         return result;
@@ -2947,7 +2958,7 @@
         if (matchData.length == 1 && matchData[0][2]) {
             return matchesStrictComparable(matchData[0][0], matchData[0][1]);
         }
-        return function(object) {
+        return function (object) {
             return object === source || baseIsMatch(object, source, matchData);
         };
     }
@@ -2964,7 +2975,7 @@
         if (isKey(path) && isStrictComparable(srcValue)) {
             return matchesStrictComparable(toKey(path), srcValue);
         }
-        return function(object) {
+        return function (object) {
             var objValue = get(object, path);
             return (objValue === undefined && objValue === srcValue)
                 ? hasIn(object, path)
@@ -2987,12 +2998,11 @@
         if (object === source) {
             return;
         }
-        baseFor(source, function(srcValue, key) {
+        baseFor(source, function (srcValue, key) {
             if (isObject(srcValue)) {
                 stack || (stack = new Stack);
                 baseMergeDeep(object, source, key, srcIndex, baseMerge, customizer, stack);
-            }
-            else {
+            } else {
                 var newValue = customizer
                     ? customizer(safeGet(object, key), srcValue, (key + ''), object, source, stack)
                     : undefined;
@@ -3044,32 +3054,25 @@
             if (isArr || isBuff || isTyped) {
                 if (isArray(objValue)) {
                     newValue = objValue;
-                }
-                else if (isArrayLikeObject(objValue)) {
+                } else if (isArrayLikeObject(objValue)) {
                     newValue = copyArray(objValue);
-                }
-                else if (isBuff) {
+                } else if (isBuff) {
                     isCommon = false;
                     newValue = cloneBuffer(srcValue, true);
-                }
-                else if (isTyped) {
+                } else if (isTyped) {
                     isCommon = false;
                     newValue = cloneTypedArray(srcValue, true);
-                }
-                else {
+                } else {
                     newValue = [];
                 }
-            }
-            else if (isPlainObject(srcValue) || isArguments(srcValue)) {
+            } else if (isPlainObject(srcValue) || isArguments(srcValue)) {
                 newValue = objValue;
                 if (isArguments(objValue)) {
                     newValue = toPlainObject(objValue);
-                }
-                else if (!isObject(objValue) || (srcIndex && isFunction(objValue))) {
+                } else if (!isObject(objValue) || (srcIndex && isFunction(objValue))) {
                     newValue = initCloneObject(srcValue);
                 }
-            }
-            else {
+            } else {
                 isCommon = false;
             }
         }
@@ -3095,14 +3098,14 @@
         var index = -1;
         iteratees = arrayMap(iteratees.length ? iteratees : [identity], baseUnary(baseIteratee));
 
-        var result = baseMap(collection, function(value, key, collection) {
-            var criteria = arrayMap(iteratees, function(iteratee) {
+        var result = baseMap(collection, function (value, key, collection) {
+            var criteria = arrayMap(iteratees, function (iteratee) {
                 return iteratee(value);
             });
             return { 'criteria': criteria, 'index': ++index, 'value': value };
         });
 
-        return baseSortBy(result, function(object, other) {
+        return baseSortBy(result, function (object, other) {
             return compareMultiple(object, other, orders);
         });
     }
@@ -3117,7 +3120,7 @@
      * @returns {Object} Returns the new object.
      */
     function basePick(object, paths) {
-        return basePickBy(object, paths, function(value, path) {
+        return basePickBy(object, paths, function (value, path) {
             return hasIn(object, path);
         });
     }
@@ -3155,7 +3158,7 @@
      * @returns {Function} Returns the new accessor function.
      */
     function basePropertyDeep(path) {
-        return function(object) {
+        return function (object) {
             return baseGet(object, path);
         };
     }
@@ -3256,7 +3259,7 @@
      * @param {*} data The metadata.
      * @returns {Function} Returns `func`.
      */
-    var baseSetData = !metaMap ? identity : function(func, data) {
+    var baseSetData = !metaMap ? identity : function (func, data) {
         metaMap.set(func, data);
         return func;
     };
@@ -3269,7 +3272,7 @@
      * @param {Function} string The `toString` result.
      * @returns {Function} Returns `func`.
      */
-    var baseSetToString = !defineProperty ? identity : function(func, string) {
+    var baseSetToString = !defineProperty ? identity : function (func, string) {
         return defineProperty(func, 'toString', {
             'configurable': true,
             'enumerable': false,
@@ -3320,7 +3323,7 @@
     function baseSome(collection, predicate) {
         var result;
 
-        baseEach(collection, function(value, index, collection) {
+        baseEach(collection, function (value, index, collection) {
             result = predicate(value, index, collection);
             return !result;
         });
@@ -3371,8 +3374,7 @@
         if (comparator) {
             isCommon = false;
             includes = arrayIncludesWith;
-        }
-        else if (length >= LARGE_ARRAY_SIZE) {
+        } else if (length >= LARGE_ARRAY_SIZE) {
             var set = iteratee ? null : createSet(array);
             if (set) {
                 return setToArray(set);
@@ -3380,8 +3382,7 @@
             isCommon = false;
             includes = cacheHas;
             seen = new SetCache;
-        }
-        else {
+        } else {
             seen = iteratee ? [] : result;
         }
         outer:
@@ -3401,8 +3402,7 @@
                         seen.push(computed);
                     }
                     result.push(value);
-                }
-                else if (!includes(seen, computed, comparator)) {
+                } else if (!includes(seen, computed, comparator)) {
                     if (seen !== result) {
                         seen.push(computed);
                     }
@@ -3441,7 +3441,7 @@
         if (result instanceof LazyWrapper) {
             result = result.value();
         }
-        return arrayReduce(actions, function(result, action) {
+        return arrayReduce(actions, function (result, action) {
             return action.func.apply(action.thisArg, arrayPush([result], action.args));
         }, result);
     }
@@ -3830,7 +3830,7 @@
      * @returns {Function} Returns the new aggregator function.
      */
     function createAggregator(setter, initializer) {
-        return function(collection, iteratee) {
+        return function (collection, iteratee) {
             var func = isArray(collection) ? arrayAggregator : baseAggregator,
                 accumulator = initializer ? initializer() : {};
 
@@ -3846,7 +3846,7 @@
      * @returns {Function} Returns the new assigner function.
      */
     function createAssigner(assigner) {
-        return baseRest(function(object, sources) {
+        return baseRest(function (object, sources) {
             var index = -1,
                 length = sources.length,
                 customizer = length > 1 ? sources[length - 1] : undefined,
@@ -3880,7 +3880,7 @@
      * @returns {Function} Returns the new base function.
      */
     function createBaseEach(eachFunc, fromRight) {
-        return function(collection, iteratee) {
+        return function (collection, iteratee) {
             if (collection == null) {
                 return collection;
             }
@@ -3908,7 +3908,7 @@
      * @returns {Function} Returns the new base function.
      */
     function createBaseFor(fromRight) {
-        return function(object, iteratee, keysFunc) {
+        return function (object, iteratee, keysFunc) {
             var index = -1,
                 iterable = Object(object),
                 props = keysFunc(object),
@@ -3942,6 +3942,7 @@
             var fn = (this && this !== root && this instanceof wrapper) ? Ctor : func;
             return fn.apply(isBind ? thisArg : this, arguments);
         }
+
         return wrapper;
     }
 
@@ -3954,20 +3955,28 @@
      * @returns {Function} Returns the new wrapped function.
      */
     function createCtor(Ctor) {
-        return function() {
+        return function () {
             // Use a `switch` statement to work with class constructors. See
             // http://ecma-international.org/ecma-262/7.0/#sec-ecmascript-function-objects-call-thisargument-argumentslist
             // for more details.
             var args = arguments;
             switch (args.length) {
-                case 0: return new Ctor;
-                case 1: return new Ctor(args[0]);
-                case 2: return new Ctor(args[0], args[1]);
-                case 3: return new Ctor(args[0], args[1], args[2]);
-                case 4: return new Ctor(args[0], args[1], args[2], args[3]);
-                case 5: return new Ctor(args[0], args[1], args[2], args[3], args[4]);
-                case 6: return new Ctor(args[0], args[1], args[2], args[3], args[4], args[5]);
-                case 7: return new Ctor(args[0], args[1], args[2], args[3], args[4], args[5], args[6]);
+                case 0:
+                    return new Ctor;
+                case 1:
+                    return new Ctor(args[0]);
+                case 2:
+                    return new Ctor(args[0], args[1]);
+                case 3:
+                    return new Ctor(args[0], args[1], args[2]);
+                case 4:
+                    return new Ctor(args[0], args[1], args[2], args[3]);
+                case 5:
+                    return new Ctor(args[0], args[1], args[2], args[3], args[4]);
+                case 6:
+                    return new Ctor(args[0], args[1], args[2], args[3], args[4], args[5]);
+                case 7:
+                    return new Ctor(args[0], args[1], args[2], args[3], args[4], args[5], args[6]);
             }
             var thisBinding = baseCreate(Ctor.prototype),
                 result = Ctor.apply(thisBinding, args);
@@ -4012,6 +4021,7 @@
             var fn = (this && this !== root && this instanceof wrapper) ? Ctor : func;
             return apply(fn, this, args);
         }
+
         return wrapper;
     }
 
@@ -4023,12 +4033,14 @@
      * @returns {Function} Returns the new find function.
      */
     function createFind(findIndexFunc) {
-        return function(collection, predicate, fromIndex) {
+        return function (collection, predicate, fromIndex) {
             var iterable = Object(collection);
             if (!isArrayLike(collection)) {
                 var iteratee = baseIteratee(predicate, 3);
                 collection = keys(collection);
-                predicate = function(key) { return iteratee(iterable[key], key, iterable); };
+                predicate = function (key) {
+                    return iteratee(iterable[key], key, iterable);
+                };
             }
             var index = findIndexFunc(collection, predicate, fromIndex);
             return index > -1 ? iterable[iteratee ? collection[index] : index] : undefined;
@@ -4105,6 +4117,7 @@
             }
             return fn.apply(thisBinding, args);
         }
+
         return wrapper;
     }
 
@@ -4117,7 +4130,7 @@
      * @returns {Function} Returns the new inverter function.
      */
     function createInverter(setter, toIteratee) {
-        return function(object, iteratee) {
+        return function (object, iteratee) {
             return baseInverter(object, setter, toIteratee(iteratee), {});
         };
     }
@@ -4154,6 +4167,7 @@
             }
             return apply(fn, isBind ? thisArg : this, args);
         }
+
         return wrapper;
     }
 
@@ -4165,7 +4179,7 @@
      * @returns {Function} Returns the new range function.
      */
     function createRange(fromRight) {
-        return function(start, end, step) {
+        return function (start, end, step) {
             if (step && typeof step != 'number' && isIterateeCall(start, end, step)) {
                 end = step = undefined;
             }
@@ -4232,7 +4246,7 @@
      * @param {Array} values The values to add to the set.
      * @returns {Object} Returns the new set.
      */
-    var createSet = !(Set && (1 / setToArray(new Set([,-0]))[1]) == INFINITY) ? noop : function(values) {
+    var createSet = !(Set && (1 / setToArray(new Set([, -0]))[1]) == INFINITY) ? noop : function (values) {
         return new Set(values);
     };
 
@@ -4405,7 +4419,7 @@
             }
             // Recursively compare arrays (susceptible to call stack limits).
             if (seen) {
-                if (!arraySome(other, function(othValue, othIndex) {
+                if (!arraySome(other, function (othValue, othIndex) {
                     if (!cacheHas(seen, othIndex) &&
                         (arrValue === othValue || equalFunc(arrValue, othValue, bitmask, customizer, stack))) {
                         return seen.push(othIndex);
@@ -4627,7 +4641,7 @@
      * @param {Function} func The function to query.
      * @returns {*} Returns the metadata for `func`.
      */
-    var getData = !metaMap ? noop : function(func) {
+    var getData = !metaMap ? noop : function (func) {
         return metaMap.get(func);
     };
 
@@ -4727,7 +4741,8 @@
         try {
             value[symToStringTag] = undefined;
             var unmasked = true;
-        } catch (e) {}
+        } catch (e) {
+        }
 
         var result = nativeObjectToString.call(value);
         if (unmasked) {
@@ -4747,12 +4762,12 @@
      * @param {Object} object The object to query.
      * @returns {Array} Returns the array of symbols.
      */
-    var getSymbols = !nativeGetSymbols ? stubArray : function(object) {
+    var getSymbols = !nativeGetSymbols ? stubArray : function (object) {
         if (object == null) {
             return [];
         }
         object = Object(object);
-        return arrayFilter(nativeGetSymbols(object), function(symbol) {
+        return arrayFilter(nativeGetSymbols(object), function (symbol) {
             return propertyIsEnumerable.call(object, symbol);
         });
     };
@@ -4764,7 +4779,7 @@
      * @param {Object} object The object to query.
      * @returns {Array} Returns the array of symbols.
      */
-    var getSymbolsIn = !nativeGetSymbols ? stubArray : function(object) {
+    var getSymbolsIn = !nativeGetSymbols ? stubArray : function (object) {
         var result = [];
         while (object) {
             arrayPush(result, getSymbols(object));
@@ -4788,18 +4803,23 @@
         (Promise && getTag(Promise.resolve()) != promiseTag) ||
         (Set && getTag(new Set) != setTag) ||
         (WeakMap && getTag(new WeakMap) != weakMapTag)) {
-        getTag = function(value) {
+        getTag = function (value) {
             var result = baseGetTag(value),
                 Ctor = result == objectTag ? value.constructor : undefined,
                 ctorString = Ctor ? toSource(Ctor) : '';
 
             if (ctorString) {
                 switch (ctorString) {
-                    case dataViewCtorString: return dataViewTag;
-                    case mapCtorString: return mapTag;
-                    case promiseCtorString: return promiseTag;
-                    case setCtorString: return setTag;
-                    case weakMapCtorString: return weakMapTag;
+                    case dataViewCtorString:
+                        return dataViewTag;
+                    case mapCtorString:
+                        return mapTag;
+                    case promiseCtorString:
+                        return promiseTag;
+                    case setCtorString:
+                        return setTag;
+                    case weakMapCtorString:
+                        return weakMapTag;
                 }
             }
             return result;
@@ -4825,10 +4845,18 @@
                 size = data.size;
 
             switch (data.type) {
-                case 'drop':      start += size; break;
-                case 'dropRight': end -= size; break;
-                case 'take':      end = nativeMin(end, start + size); break;
-                case 'takeRight': start = nativeMax(start, end - size); break;
+                case 'drop':
+                    start += size;
+                    break;
+                case 'dropRight':
+                    end -= size;
+                    break;
+                case 'take':
+                    end = nativeMin(end, start + size);
+                    break;
+                case 'takeRight':
+                    start = nativeMax(start, end - size);
+                    break;
             }
         }
         return { 'start': start, 'end': end };
@@ -4934,9 +4962,15 @@
             case dataViewTag:
                 return cloneDataView(object, isDeep);
 
-            case float32Tag: case float64Tag:
-            case int8Tag: case int16Tag: case int32Tag:
-            case uint8Tag: case uint8ClampedTag: case uint16Tag: case uint32Tag:
+            case float32Tag:
+            case float64Tag:
+            case int8Tag:
+            case int16Tag:
+            case int32Tag:
+            case uint8Tag:
+            case uint8ClampedTag:
+            case uint16Tag:
+            case uint32Tag:
                 return cloneTypedArray(object, isDeep);
 
             case mapTag:
@@ -5134,7 +5168,7 @@
      * @returns {Function} Returns the new spec function.
      */
     function matchesStrictComparable(key, srcValue) {
-        return function(object) {
+        return function (object) {
             if (object == null) {
                 return false;
             }
@@ -5152,7 +5186,7 @@
      * @returns {Function} Returns the new memoized function.
      */
     function memoizeCapped(func) {
-        var result = memoize(func, function(key) {
+        var result = memoize(func, function (key) {
             if (cache.size === MAX_MEMOIZE_SIZE) {
                 cache.clear();
             }
@@ -5275,7 +5309,7 @@
      */
     function overRest(func, start, transform) {
         start = nativeMax(start === undefined ? (func.length - 1) : start, 0);
-        return function() {
+        return function () {
             var args = arguments,
                 index = -1,
                 length = nativeMax(args.length - start, 0),
@@ -5382,7 +5416,7 @@
         var count = 0,
             lastCalled = 0;
 
-        return function() {
+        return function () {
             var stamp = nativeNow(),
                 remaining = HOT_SPAN - (stamp - lastCalled);
 
@@ -5405,12 +5439,12 @@
      * @param {string} string The string to convert.
      * @returns {Array} Returns the property path array.
      */
-    var stringToPath = memoizeCapped(function(string) {
+    var stringToPath = memoizeCapped(function (string) {
         var result = [];
         if (string.charCodeAt(0) === 46 /* . */) {
             result.push('');
         }
-        string.replace(rePropName, function(match, number, quote, subString) {
+        string.replace(rePropName, function (match, number, quote, subString) {
             result.push(quote ? subString.replace(reEscapeChar, '$1') : (number || match));
         });
         return result;
@@ -5442,10 +5476,12 @@
         if (func != null) {
             try {
                 return funcToString.call(func);
-            } catch (e) {}
+            } catch (e) {
+            }
             try {
                 return (func + '');
-            } catch (e) {}
+            } catch (e) {
+            }
         }
         return '';
     }
@@ -5459,7 +5495,7 @@
      * @returns {Array} Returns `details`.
      */
     function updateWrapDetails(details, bitmask) {
-        arrayEach(wrapFlags, function(pair) {
+        arrayEach(wrapFlags, function (pair) {
             var value = '_.' + pair[0];
             if ((bitmask & pair[1]) && !arrayIncludes(details, value)) {
                 details.push(value);
@@ -5481,7 +5517,7 @@
         }
         var result = new LodashWrapper(wrapper.__wrapped__, wrapper.__chain__);
         result.__actions__ = copyArray(wrapper.__actions__);
-        result.__index__  = wrapper.__index__;
+        result.__index__ = wrapper.__index__;
         result.__values__ = wrapper.__values__;
         return result;
     }
@@ -5617,7 +5653,7 @@
      * _.difference([2, 1], [2, 3]);
      * // => [1]
      */
-    var difference = baseRest(function(array, values) {
+    var difference = baseRest(function (array, values) {
         return isArrayLikeObject(array)
             ? baseDifference(array, baseFlatten(values, 1, isArrayLikeObject, true))
             : [];
@@ -5885,7 +5921,7 @@
      * _.intersection([2, 1], [2, 3]);
      * // => [2]
      */
-    var intersection = baseRest(function(arrays) {
+    var intersection = baseRest(function (arrays) {
         var mapped = arrayMap(arrays, castArrayLikeObject);
         return (mapped.length && mapped[0] === arrays[0])
             ? baseIntersection(mapped)
@@ -5962,8 +5998,7 @@
         if (end && typeof end != 'number' && isIterateeCall(array, start, end)) {
             start = 0;
             end = length;
-        }
-        else {
+        } else {
             start = start == null ? 0 : toInteger(start);
             end = end === undefined ? length : toInteger(end);
         }
@@ -6054,7 +6089,7 @@
      * _.union([2], [1, 2]);
      * // => [2, 1]
      */
-    var union = baseRest(function(arrays) {
+    var union = baseRest(function (arrays) {
         return baseUniq(baseFlatten(arrays, 1, isArrayLikeObject, true));
     });
 
@@ -6131,13 +6166,13 @@
             return [];
         }
         var length = 0;
-        array = arrayFilter(array, function(group) {
+        array = arrayFilter(array, function (group) {
             if (isArrayLikeObject(group)) {
                 length = nativeMax(group.length, length);
                 return true;
             }
         });
-        return baseTimes(length, function(index) {
+        return baseTimes(length, function (index) {
             return arrayMap(array, baseProperty(index));
         });
     }
@@ -6162,7 +6197,7 @@
      * _.without([2, 1, 2, 3], 1, 2);
      * // => [3]
      */
-    var without = baseRest(function(array, values) {
+    var without = baseRest(function (array, values) {
         return isArrayLikeObject(array)
             ? baseDifference(array, values)
             : [];
@@ -6314,11 +6349,13 @@
      * _(object).at(['a[0].b.c', 'a[1]']).value();
      * // => [3, 4]
      */
-    var wrapperAt = flatRest(function(paths) {
+    var wrapperAt = flatRest(function (paths) {
         var length = paths.length,
             start = length ? paths[0] : 0,
             value = this.__wrapped__,
-            interceptor = function(object) { return baseAt(object, paths); };
+            interceptor = function (object) {
+                return baseAt(object, paths);
+            };
 
         if (length > 1 || this.__actions__.length ||
             !(value instanceof LazyWrapper) || !isIndex(start)) {
@@ -6330,7 +6367,7 @@
             'args': [interceptor],
             'thisArg': undefined
         });
-        return new LodashWrapper(value, this.__chain__).thru(function(array) {
+        return new LodashWrapper(value, this.__chain__).thru(function (array) {
             if (length && !array.length) {
                 array.push(undefined);
             }
@@ -6577,7 +6614,7 @@
      * _.countBy(['one', 'two', 'three'], 'length');
      * // => { '3': 2, '5': 1 }
      */
-    var countBy = createAggregator(function(result, value, key) {
+    var countBy = createAggregator(function (result, value, key) {
         if (hasOwnProperty.call(result, key)) {
             ++result[key];
         } else {
@@ -6772,7 +6809,7 @@
      * _.groupBy(['one', 'two', 'three'], 'length');
      * // => { '3': ['one', 'two'], '5': ['three'] }
      */
-    var groupBy = createAggregator(function(result, value, key) {
+    var groupBy = createAggregator(function (result, value, key) {
         if (hasOwnProperty.call(result, key)) {
             result[key].push(value);
         } else {
@@ -7018,7 +7055,7 @@
      * _.sortBy(users, ['user', 'age']);
      * // => objects for [['barney', 34], ['barney', 36], ['fred', 40], ['fred', 48]]
      */
-    var sortBy = baseRest(function(collection, iteratees) {
+    var sortBy = baseRest(function (collection, iteratees) {
         if (collection == null) {
             return [];
         }
@@ -7049,7 +7086,7 @@
      * }, _.now());
      * // => Logs the number of milliseconds it took for the deferred invocation.
      */
-    var now = function() {
+    var now = function () {
         return root.Date.now();
     };
 
@@ -7084,7 +7121,7 @@
             throw new TypeError(FUNC_ERROR_TEXT);
         }
         n = toInteger(n);
-        return function() {
+        return function () {
             if (--n < 1) {
                 return func.apply(this, arguments);
             }
@@ -7114,7 +7151,7 @@
             throw new TypeError(FUNC_ERROR_TEXT);
         }
         n = toInteger(n);
-        return function() {
+        return function () {
             if (--n > 0) {
                 result = func.apply(this, arguments);
             }
@@ -7160,7 +7197,7 @@
      * bound('hi');
      * // => 'hi fred!'
      */
-    var bind = baseRest(function(func, thisArg, partials) {
+    var bind = baseRest(function (func, thisArg, partials) {
         var bitmask = WRAP_BIND_FLAG;
         if (partials.length) {
             var holders = replaceHolders(partials, getHolder(bind));
@@ -7342,6 +7379,7 @@
             }
             return result;
         }
+
         debounced.cancel = cancel;
         debounced.flush = flush;
         return debounced;
@@ -7365,7 +7403,7 @@
      * }, 'deferred');
      * // => Logs 'deferred' after one millisecond.
      */
-    var defer = baseRest(function(func, args) {
+    var defer = baseRest(function (func, args) {
         return baseDelay(func, 1, args);
     });
 
@@ -7388,7 +7426,7 @@
      * }, 1000, 'later');
      * // => Logs 'later' after one second.
      */
-    var delay = baseRest(function(func, wait, args) {
+    var delay = baseRest(function (func, wait, args) {
         return baseDelay(func, toNumber(wait) || 0, args);
     });
 
@@ -7440,7 +7478,7 @@
         if (typeof func != 'function' || (resolver != null && typeof resolver != 'function')) {
             throw new TypeError(FUNC_ERROR_TEXT);
         }
-        var memoized = function() {
+        var memoized = function () {
             var args = arguments,
                 key = resolver ? resolver.apply(this, args) : args[0],
                 cache = memoized.cache;
@@ -7483,13 +7521,17 @@
         if (typeof predicate != 'function') {
             throw new TypeError(FUNC_ERROR_TEXT);
         }
-        return function() {
+        return function () {
             var args = arguments;
             switch (args.length) {
-                case 0: return !predicate.call(this);
-                case 1: return !predicate.call(this, args[0]);
-                case 2: return !predicate.call(this, args[0], args[1]);
-                case 3: return !predicate.call(this, args[0], args[1], args[2]);
+                case 0:
+                    return !predicate.call(this);
+                case 1:
+                    return !predicate.call(this, args[0]);
+                case 2:
+                    return !predicate.call(this, args[0], args[1]);
+                case 3:
+                    return !predicate.call(this, args[0], args[1], args[2]);
             }
             return !predicate.apply(this, args);
         };
@@ -7720,7 +7762,9 @@
      * _.isArguments([1, 2, 3]);
      * // => false
      */
-    var isArguments = baseIsArguments(function() { return arguments; }()) ? baseIsArguments : function(value) {
+    var isArguments = baseIsArguments(function () {
+        return arguments;
+    }()) ? baseIsArguments : function (value) {
         return isObjectLike(value) && hasOwnProperty.call(value, 'callee') &&
             !propertyIsEnumerable.call(value, 'callee');
     };
@@ -8609,7 +8653,7 @@
      * _.assignIn({ 'a': 0 }, new Foo, new Bar);
      * // => { 'a': 1, 'b': 2, 'c': 3, 'd': 4 }
      */
-    var assignIn = createAssigner(function(object, source) {
+    var assignIn = createAssigner(function (object, source) {
         copyObject(source, keysIn(source), object);
     });
 
@@ -8673,7 +8717,7 @@
      * _.defaults({ 'a': 1 }, { 'b': 2 }, { 'a': 3 });
      * // => { 'a': 1, 'b': 2 }
      */
-    var defaults = baseRest(function(object, sources) {
+    var defaults = baseRest(function (object, sources) {
         object = Object(object);
 
         var index = -1;
@@ -8723,7 +8767,7 @@
      * _.defaultsDeep({ 'a': { 'b': 2 } }, { 'a': { 'b': 1, 'c': 3 } });
      * // => { 'a': { 'b': 2, 'c': 3 } }
      */
-    var defaultsDeep = baseRest(function(args) {
+    var defaultsDeep = baseRest(function (args) {
         args.push(undefined, customDefaultsMerge);
         return apply(mergeWith, undefined, args);
     });
@@ -8915,7 +8959,7 @@
      * _.invert(object);
      * // => { '1': 'c', '2': 'b' }
      */
-    var invert = createInverter(function(result, value, key) {
+    var invert = createInverter(function (result, value, key) {
         if (value != null &&
             typeof value.toString != 'function') {
             value = nativeObjectToString.call(value);
@@ -8950,7 +8994,7 @@
      * });
      * // => { 'group1': ['a', 'c'], 'group2': ['b'] }
      */
-    var invertBy = createInverter(function(result, value, key) {
+    var invertBy = createInverter(function (result, value, key) {
         if (value != null &&
             typeof value.toString != 'function') {
             value = nativeObjectToString.call(value);
@@ -9053,7 +9097,7 @@
      * _.merge(object, other);
      * // => { 'a': [{ 'b': 2, 'c': 3 }, { 'd': 4, 'e': 5 }] }
      */
-    var merge = createAssigner(function(object, source, srcIndex) {
+    var merge = createAssigner(function (object, source, srcIndex) {
         baseMerge(object, source, srcIndex);
     });
 
@@ -9088,7 +9132,7 @@
      * _.mergeWith(object, other, customizer);
      * // => { 'a': [1, 3], 'b': [2, 4] }
      */
-    var mergeWith = createAssigner(function(object, source, srcIndex, customizer) {
+    var mergeWith = createAssigner(function (object, source, srcIndex, customizer) {
         baseMerge(object, source, srcIndex, customizer);
     });
 
@@ -9112,13 +9156,13 @@
      * _.omit(object, ['a', 'c']);
      * // => { 'b': '2' }
      */
-    var omit = flatRest(function(object, paths) {
+    var omit = flatRest(function (object, paths) {
         var result = {};
         if (object == null) {
             return result;
         }
         var isDeep = false;
-        paths = arrayMap(paths, function(path) {
+        paths = arrayMap(paths, function (path) {
             path = castPath(path, object);
             isDeep || (isDeep = path.length > 1);
             return path;
@@ -9175,7 +9219,7 @@
      * _.pick(object, ['a', 'c']);
      * // => { 'a': 1, 'c': 3 }
      */
-    var pick = flatRest(function(object, paths) {
+    var pick = flatRest(function (object, paths) {
         return object == null ? {} : basePick(object, paths);
     });
 
@@ -9201,11 +9245,11 @@
         if (object == null) {
             return {};
         }
-        var props = arrayMap(getAllKeysIn(object), function(prop) {
+        var props = arrayMap(getAllKeysIn(object), function (prop) {
             return [prop];
         });
         predicate = baseIteratee(predicate);
-        return basePickBy(object, props, function(value, path) {
+        return basePickBy(object, props, function (value, path) {
             return predicate(value, path[0]);
         });
     }
@@ -9399,8 +9443,7 @@
             if (typeof upper == 'boolean') {
                 floating = upper;
                 upper = undefined;
-            }
-            else if (typeof lower == 'boolean') {
+            } else if (typeof lower == 'boolean') {
                 floating = lower;
                 lower = undefined;
             }
@@ -9408,8 +9451,7 @@
         if (lower === undefined && upper === undefined) {
             lower = 0;
             upper = 1;
-        }
-        else {
+        } else {
             lower = toFinite(lower);
             if (upper === undefined) {
                 upper = lower;
@@ -9553,7 +9595,7 @@
      * // => true
      */
     function constant(value) {
-        return function() {
+        return function () {
             return value;
         };
     }
@@ -9706,11 +9748,11 @@
         var chain = !(isObject(options) && 'chain' in options) || !!options.chain,
             isFunc = isFunction(object);
 
-        arrayEach(methodNames, function(methodName) {
+        arrayEach(methodNames, function (methodName) {
             var func = source[methodName];
             object[methodName] = func;
             if (isFunc) {
-                object.prototype[methodName] = function() {
+                object.prototype[methodName] = function () {
                     var chainAll = this.__chain__;
                     if (chain || chainAll) {
                         var result = object(this.__wrapped__),
@@ -10065,9 +10107,9 @@
     lodash.each = forEach;
     lodash.first = head;
 
-    mixin(lodash, (function() {
+    mixin(lodash, (function () {
         var source = {};
-        baseForOwn(lodash, function(func, methodName) {
+        baseForOwn(lodash, function (func, methodName) {
             if (!hasOwnProperty.call(lodash.prototype, methodName)) {
                 source[methodName] = func;
             }
@@ -10087,8 +10129,8 @@
     lodash.VERSION = VERSION;
 
     // Add `LazyWrapper` methods for `_.drop` and `_.take` variants.
-    arrayEach(['drop', 'take'], function(methodName, index) {
-        LazyWrapper.prototype[methodName] = function(n) {
+    arrayEach(['drop', 'take'], function (methodName, index) {
+        LazyWrapper.prototype[methodName] = function (n) {
             n = n === undefined ? 1 : nativeMax(toInteger(n), 0);
 
             var result = (this.__filtered__ && !index)
@@ -10106,17 +10148,17 @@
             return result;
         };
 
-        LazyWrapper.prototype[methodName + 'Right'] = function(n) {
+        LazyWrapper.prototype[methodName + 'Right'] = function (n) {
             return this.reverse()[methodName](n).reverse();
         };
     });
 
     // Add `LazyWrapper` methods that accept an `iteratee` value.
-    arrayEach(['filter', 'map', 'takeWhile'], function(methodName, index) {
+    arrayEach(['filter', 'map', 'takeWhile'], function (methodName, index) {
         var type = index + 1,
             isFilter = type == LAZY_FILTER_FLAG || type == LAZY_WHILE_FLAG;
 
-        LazyWrapper.prototype[methodName] = function(iteratee) {
+        LazyWrapper.prototype[methodName] = function (iteratee) {
             var result = this.clone();
             result.__iteratees__.push({
                 'iteratee': getIteratee(iteratee, 3),
@@ -10128,49 +10170,49 @@
     });
 
     // Add `LazyWrapper` methods for `_.head` and `_.last`.
-    arrayEach(['head', 'last'], function(methodName, index) {
+    arrayEach(['head', 'last'], function (methodName, index) {
         var takeName = 'take' + (index ? 'Right' : '');
 
-        LazyWrapper.prototype[methodName] = function() {
+        LazyWrapper.prototype[methodName] = function () {
             return this[takeName](1).value()[0];
         };
     });
 
     // Add `LazyWrapper` methods for `_.initial` and `_.tail`.
-    arrayEach(['initial', 'tail'], function(methodName, index) {
+    arrayEach(['initial', 'tail'], function (methodName, index) {
         var dropName = 'drop' + (index ? '' : 'Right');
 
-        LazyWrapper.prototype[methodName] = function() {
+        LazyWrapper.prototype[methodName] = function () {
             return this.__filtered__ ? new LazyWrapper(this) : this[dropName](1);
         };
     });
 
-    LazyWrapper.prototype.compact = function() {
+    LazyWrapper.prototype.compact = function () {
         return this.filter(identity);
     };
 
-    LazyWrapper.prototype.find = function(predicate) {
+    LazyWrapper.prototype.find = function (predicate) {
         return this.filter(predicate).head();
     };
 
-    LazyWrapper.prototype.findLast = function(predicate) {
+    LazyWrapper.prototype.findLast = function (predicate) {
         return this.reverse().find(predicate);
     };
 
-    LazyWrapper.prototype.invokeMap = baseRest(function(path, args) {
+    LazyWrapper.prototype.invokeMap = baseRest(function (path, args) {
         if (typeof path == 'function') {
             return new LazyWrapper(this);
         }
-        return this.map(function(value) {
+        return this.map(function (value) {
             return baseInvoke(value, path, args);
         });
     });
 
-    LazyWrapper.prototype.reject = function(predicate) {
+    LazyWrapper.prototype.reject = function (predicate) {
         return this.filter(negate(getIteratee(predicate)));
     };
 
-    LazyWrapper.prototype.slice = function(start, end) {
+    LazyWrapper.prototype.slice = function (start, end) {
         start = toInteger(start);
 
         var result = this;
@@ -10189,16 +10231,16 @@
         return result;
     };
 
-    LazyWrapper.prototype.takeRightWhile = function(predicate) {
+    LazyWrapper.prototype.takeRightWhile = function (predicate) {
         return this.reverse().takeWhile(predicate).reverse();
     };
 
-    LazyWrapper.prototype.toArray = function() {
+    LazyWrapper.prototype.toArray = function () {
         return this.take(MAX_ARRAY_LENGTH);
     };
 
     // Add `LazyWrapper` methods to `lodash.prototype`.
-    baseForOwn(LazyWrapper.prototype, function(func, methodName) {
+    baseForOwn(LazyWrapper.prototype, function (func, methodName) {
         var checkIteratee = /^(?:filter|find|map|reject)|While$/.test(methodName),
             isTaker = /^(?:head|last)$/.test(methodName),
             lodashFunc = lodash[isTaker ? ('take' + (methodName == 'last' ? 'Right' : '')) : methodName],
@@ -10207,14 +10249,14 @@
         if (!lodashFunc) {
             return;
         }
-        lodash.prototype[methodName] = function() {
+        lodash.prototype[methodName] = function () {
             var value = this.__wrapped__,
                 args = isTaker ? [1] : arguments,
                 isLazy = value instanceof LazyWrapper,
                 iteratee = args[0],
                 useLazy = isLazy || isArray(value);
 
-            var interceptor = function(value) {
+            var interceptor = function (value) {
                 var result = lodashFunc.apply(lodash, arrayPush([value], args));
                 return (isTaker && chainAll) ? result[0] : result;
             };
@@ -10243,25 +10285,25 @@
     });
 
     // Add `Array` methods to `lodash.prototype`.
-    arrayEach(['pop', 'push', 'shift', 'sort', 'splice', 'unshift'], function(methodName) {
+    arrayEach(['pop', 'push', 'shift', 'sort', 'splice', 'unshift'], function (methodName) {
         var func = arrayProto[methodName],
             chainName = /^(?:push|sort|unshift)$/.test(methodName) ? 'tap' : 'thru',
             retUnwrapped = /^(?:pop|shift)$/.test(methodName);
 
-        lodash.prototype[methodName] = function() {
+        lodash.prototype[methodName] = function () {
             var args = arguments;
             if (retUnwrapped && !this.__chain__) {
                 var value = this.value();
                 return func.apply(isArray(value) ? value : [], args);
             }
-            return this[chainName](function(value) {
+            return this[chainName](function (value) {
                 return func.apply(isArray(value) ? value : [], args);
             });
         };
     });
 
     // Map minified method names to their real names.
-    baseForOwn(LazyWrapper.prototype, function(func, methodName) {
+    baseForOwn(LazyWrapper.prototype, function (func, methodName) {
         var lodashFunc = lodash[methodName];
         if (lodashFunc) {
             var key = (lodashFunc.name + ''),
@@ -10271,10 +10313,12 @@
         }
     });
 
-    realNames[createHybrid(undefined, WRAP_BIND_KEY_FLAG).name] = [{
-        'name': 'wrapper',
-        'func': undefined
-    }];
+    realNames[createHybrid(undefined, WRAP_BIND_KEY_FLAG).name] = [
+        {
+            'name': 'wrapper',
+            'func': undefined
+        }
+    ];
 
     // Add methods to `LazyWrapper`.
     LazyWrapper.prototype.clone = lazyClone;
@@ -10300,7 +10344,7 @@
 
         // Define as an anonymous module so, through path mapping, it can be
         // referenced as the "underscore" module.
-        define(function() {
+        define(function () {
             return lodash;
         });
     }
@@ -10310,8 +10354,7 @@
         (freeModule.exports = lodash)._ = lodash;
         // Export for CommonJS support.
         freeExports._ = lodash;
-    }
-    else {
+    } else {
         // Export to the global object.
         BI._ = lodash;
     }

From 2287879d95fbd64c30b7428d5bbd6e3d276b1e31 Mon Sep 17 00:00:00 2001
From: zsmj <zsmj1994@gmail.com>
Date: Thu, 12 Jan 2023 16:15:03 +0800
Subject: [PATCH 3/4] update

---
 src/widget/index.js | 5 -----
 1 file changed, 5 deletions(-)

diff --git a/src/widget/index.js b/src/widget/index.js
index 5d238bd4f..14146c7ae 100644
--- a/src/widget/index.js
+++ b/src/widget/index.js
@@ -46,11 +46,6 @@ export * from "./datetimepane";
 export * from "./dynamicdatetime";
 export * from "./time";
 export * from "./editor";
-export { SelectTreeCombo } from "./selecttree/selecttree.combo";
-export { SingleTreeCombo } from "./singletree/singletree.combo";
-export { MultiTreeCombo } from "./multitree/multi.tree.combo";
-export { MultiTreeInsertCombo } from "./multitree/multi.tree.insert.combo";
-export { MultiTreeListCombo } from "./multitree/multi.tree.list.combo";
 export * from "./multiselect";
 export * from "./multiselectlist";
 

From f87bab8068dd4271cad76b57d4d8f777436cd510 Mon Sep 17 00:00:00 2001
From: =?UTF-8?q?Joker=2EWang-=E7=8E=8B=E9=A1=BA?= <Joker.Wang@fanruan.com>
Date: Thu, 12 Jan 2023 16:26:37 +0800
Subject: [PATCH 4/4] =?UTF-8?q?KERNEL-14083=20refactor:=20widget/downlist?=
 =?UTF-8?q?=E3=80=81singleslider=E3=80=81intervalslider=20es6=E5=8C=96?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 src/case/calendar/calendar.js                 |   4 +-
 src/case/layer/panel.js                       |   4 +-
 src/case/list/list.select.js                  |  10 +-
 src/core/wrapper/layout/flex/flex.vertical.js |   1 -
 src/widget/downlist/combo.downlist.js         | 268 ++++---
 src/widget/downlist/group.downlist.js         | 113 +--
 src/widget/downlist/index.js                  |   5 +
 src/widget/downlist/item.downlist.js          | 227 +++---
 src/widget/downlist/item.downlistgroup.js     | 259 ++++---
 src/widget/downlist/popup.downlist.js         | 587 +++++++-------
 src/widget/index.js                           |   9 +
 src/widget/intervalslider/index.js            |   2 +
 src/widget/intervalslider/intervalslider.js   | 726 ++++++++++--------
 .../model.accuratecalculation.js              | 271 ++++---
 .../singleslider/button/editor.sign.text.js   | 265 ++++---
 .../singleslider/button/iconbutton.slider.js  |  28 +-
 src/widget/singleslider/index.js              |   5 +
 src/widget/singleslider/singleslider.js       | 526 +++++++------
 src/widget/singleslider/singleslider.label.js | 464 ++++++-----
 .../singleslider/singleslider.normal.js       | 430 ++++++-----
 20 files changed, 2350 insertions(+), 1854 deletions(-)
 create mode 100644 src/widget/downlist/index.js
 create mode 100644 src/widget/intervalslider/index.js
 create mode 100644 src/widget/singleslider/index.js

diff --git a/src/case/calendar/calendar.js b/src/case/calendar/calendar.js
index b656a271e..b049e18b4 100644
--- a/src/case/calendar/calendar.js
+++ b/src/case/calendar/calendar.js
@@ -139,8 +139,8 @@ export class Calendar extends Widget {
                 rowSize: BI.SIZE_CONSANTS.LIST_ITEM_HEIGHT + 8,
             }))],
         });
-        this.days.on(Controller.EVENT_CHANGE, () => {
-            this.fireEvent(Controller.EVENT_CHANGE, arguments);
+        this.days.on(Controller.EVENT_CHANGE, (...args) => {
+            this.fireEvent(Controller.EVENT_CHANGE, ...args);
         });
         createWidget(extend({
             element: this,
diff --git a/src/case/layer/panel.js b/src/case/layer/panel.js
index 51bd4fc50..de18dc35f 100644
--- a/src/case/layer/panel.js
+++ b/src/case/layer/panel.js
@@ -50,8 +50,8 @@ export class Panel extends Widget {
             }],
         });
 
-        this.button_group.on(Controller.EVENT_CHANGE, () => {
-            this.fireEvent(Controller.EVENT_CHANGE, ...arguments);
+        this.button_group.on(Controller.EVENT_CHANGE, (...args) => {
+            this.fireEvent(Controller.EVENT_CHANGE, ...args);
         });
 
         this.button_group.on(ButtonGroup.EVENT_CHANGE, (value, obj) => {
diff --git a/src/case/list/list.select.js b/src/case/list/list.select.js
index e9fce794a..88f4856c6 100644
--- a/src/case/list/list.select.js
+++ b/src/case/list/list.select.js
@@ -55,13 +55,14 @@ export class SelectList extends Widget {
         // 全选
         this.toolbar = createWidget(o.toolbar);
         this.allSelected = false;
-        this.toolbar.on(Controller.EVENT_CHANGE, (type, value, obj) => {
+        this.toolbar.on(Controller.EVENT_CHANGE, (...args) => {
+            const [type, value, obj] = args;
             this.allSelected = this.toolbar.isSelected();
             if (type === Events.CLICK) {
                 this.setAllSelected(this.allSelected);
                 this.fireEvent(SelectList.EVENT_CHANGE, value, obj);
             }
-            this.fireEvent(Controller.EVENT_CHANGE, arguments);
+            this.fireEvent(Controller.EVENT_CHANGE, ...args);
         });
 
         this.list = createWidget(o.el, {
@@ -84,12 +85,13 @@ export class SelectList extends Widget {
             hasNext: o.hasNext,
         });
 
-        this.list.on(Controller.EVENT_CHANGE, (type, value, obj) => {
+        this.list.on(Controller.EVENT_CHANGE, (...args) => {
+            const [type, value, obj] = args;
             if (type === Events.CLICK) {
                 this._checkAllSelected();
                 this.fireEvent(SelectList.EVENT_CHANGE, value, obj);
             }
-            this.fireEvent(Controller.EVENT_CHANGE, arguments);
+            this.fireEvent(Controller.EVENT_CHANGE, ...args);
         });
 
         createWidget(extend({
diff --git a/src/core/wrapper/layout/flex/flex.vertical.js b/src/core/wrapper/layout/flex/flex.vertical.js
index fefc7abad..5ee654642 100644
--- a/src/core/wrapper/layout/flex/flex.vertical.js
+++ b/src/core/wrapper/layout/flex/flex.vertical.js
@@ -12,7 +12,6 @@ import { Layout } from "../../layout";
 @shortcut()
 export class FlexVerticalLayout extends Layout {
     static xtype = "bi.flex_vertical";
-
     props() {
         return extend(super.props(...arguments), {
             baseCls: "bi-f-v",
diff --git a/src/widget/downlist/combo.downlist.js b/src/widget/downlist/combo.downlist.js
index 10c39bfbf..eb4c9e636 100644
--- a/src/widget/downlist/combo.downlist.js
+++ b/src/widget/downlist/combo.downlist.js
@@ -1,143 +1,155 @@
-(function() {
-    function transformItems(items) {
-        if (!items) return items;
-        var result = BI.cloneDeep(items);
-        var isComplexItmes = BI.some(items, function (_, item) {
-            return BI.isArray(item);
+import { shortcut, Widget, extend, createWidget, cloneDeep, some, isArray, each } from "@/core";
+import { DownListPopup } from "./popup.downlist";
+import { Combo } from "@/base";
+import { IconTrigger } from "@/case";
+
+
+function transformItems(items) {
+    if (!items) return items;
+    let result = cloneDeep(items);
+    const isComplexItmes = some(items, (_, item) => isArray(item));
+    // 传一维数组，帮转二维
+    if (!isComplexItmes) {
+        result = [result];
+    }
+    // 帮转 el
+    each(result, (_, arr) => {
+        each(arr, (_, item) => {
+            if (item.children && !item.el) {
+                item.el = {
+                    text: item.text,
+                    icon: item.icon,
+                    cls: item.cls,
+                    iconCls1: item.iconCls1,
+                    value: item.value,
+                };
+            }
         });
-        // 传一维数组，帮转二维
-        if (!isComplexItmes) {
-            result = [result];
-        }
-        // 帮转 el
-        BI.each(result, function (_, arr) {
-            BI.each(arr, function (_, item) {
-                if (item.children && !item.el) {
-                    item.el = {
-                        text: item.text,
-                        icon: item.icon,
-                        cls: item.cls,
-                        iconCls1: item.iconCls1,
-                        value: item.value
-                    };
-                }
-            });
+    });
+    
+    return result;
+}
+
+@shortcut()
+export class DownListCombo extends Widget {
+    static xtype = "bi.down_list_combo";
+
+    static EVENT_CHANGE = "EVENT_CHANGE";
+    static EVENT_SON_VALUE_CHANGE = "EVENT_SON_VALUE_CHANGE";
+    static EVENT_BEFORE_POPUPVIEW = "EVENT_BEFORE_POPUPVIEW";
+
+    _defaultConfig() {
+        return extend(super._defaultConfig(...arguments), {
+            baseCls: "bi-down-list-combo",
+            height: 24,
+            items: [],
+            adjustLength: 0,
+            direction: "bottom",
+            trigger: "click",
+            container: null,
+            stopPropagation: false,
+            el: {},
+            popup: {},
+            minWidth: 140,
+            maxHeight: 1000,
+            destroyWhenHide: false,
+            isDefaultInit: true,
         });
-        return result;
     }
 
-    /**
-     * Created by roy on 15/8/14.
-     */
-    BI.DownListCombo = BI.inherit(BI.Widget, {
-        _defaultConfig: function () {
-            return BI.extend(BI.DownListCombo.superclass._defaultConfig.apply(this, arguments), {
-                baseCls: "bi-down-list-combo",
-                height: 24,
-                items: [],
-                adjustLength: 0,
-                direction: "bottom",
-                trigger: "click",
-                container: null,
-                stopPropagation: false,
-                el: {},
-                popup: {},
-                minWidth: 140,
-                maxHeight: 1000,
-                destroyWhenHide: false,
-                isDefaultInit: true,
-            });
-        },
+    _init() {
+        super._init(...arguments);
+        const o = this.options;
 
-        _init: function () {
-            BI.DownListCombo.superclass._init.apply(this, arguments);
-            var self = this, o = this.options;
-
-            this.downlistcombo = BI.createWidget({
-                element: this,
-                type: "bi.combo",
-                trigger: o.trigger,
-                isNeedAdjustWidth: false,
-                isDefaultInit: o.isDefaultInit,
-                container: o.container,
-                adjustLength: o.adjustLength,
-                direction: o.direction,
-                belowMouse: o.belowMouse,
-                stopPropagation: o.stopPropagation,
-                destroyWhenHide: o.destroyWhenHide,
+        this.downlistcombo = createWidget({
+            element: this,
+            type: Combo.xtype,
+            trigger: o.trigger,
+            isNeedAdjustWidth: false,
+            isDefaultInit: o.isDefaultInit,
+            container: o.container,
+            adjustLength: o.adjustLength,
+            direction: o.direction,
+            belowMouse: o.belowMouse,
+            stopPropagation: o.stopPropagation,
+            destroyWhenHide: o.destroyWhenHide,
+            el: {
+                type: IconTrigger.xtype,
+                extraCls: o.iconCls,
+                width: o.width,
+                height: o.height,
+                ...o.el,
+            },
+            popup: {
                 el: {
-                    type: "bi.icon_trigger",
-                    extraCls: o.iconCls,
-                    width: o.width,
-                    height: o.height,
-                    ...o.el
-                },
-                popup: {
-                    el: {
-                        type: "bi.down_list_popup",
-                        ref: function (ref) {
-                            self.popupView = ref;
-                        },
-                        items: transformItems(o.items),
-                        chooseType: o.chooseType,
-                        value: o.value,
-                        listeners: [{
-                            eventName: BI.DownListPopup.EVENT_CHANGE,
-                            action: function (value) {
-                                self.fireEvent(BI.DownListCombo.EVENT_CHANGE, value);
-                                self.downlistcombo.hideView();
-                            }
-                        }, {
-                            eventName: BI.DownListPopup.EVENT_SON_VALUE_CHANGE,
-                            action: function (value, fatherValue) {
-                                self.fireEvent(BI.DownListCombo.EVENT_SON_VALUE_CHANGE, value, fatherValue);
-                                self.downlistcombo.hideView();
-                            }
-                        }]
+                    type: DownListPopup.xtype,
+                    ref: _ref => {
+                        this.popupView = _ref;
                     },
-                    stopPropagation: o.stopPropagation,
-                    maxHeight: o.maxHeight,
-                    minWidth: o.minWidth,
-                    ...o.popup
-                }
-            });
-
-            this.downlistcombo.on(BI.Combo.EVENT_BEFORE_POPUPVIEW, function () {
-                self.fireEvent(BI.DownListCombo.EVENT_BEFORE_POPUPVIEW);
-            });
-        },
+                    items: transformItems(o.items),
+                    chooseType: o.chooseType,
+                    value: o.value,
+                    listeners: [
+                        {
+                            eventName: DownListPopup.EVENT_CHANGE,
+                            action: value => {
+                                this.fireEvent(
+                                    DownListCombo.EVENT_CHANGE,
+                                    value
+                                );
+                                this.downlistcombo.hideView();
+                            },
+                        },
+                        {
+                            eventName: DownListPopup.EVENT_SON_VALUE_CHANGE,
+                            action: (value, fatherValue) => {
+                                this.fireEvent(
+                                    DownListCombo.EVENT_SON_VALUE_CHANGE,
+                                    value,
+                                    fatherValue
+                                );
+                                this.downlistcombo.hideView();
+                            },
+                        }
+                    ],
+                },
+                stopPropagation: o.stopPropagation,
+                maxHeight: o.maxHeight,
+                minWidth: o.minWidth,
+                ...o.popup,
+            },
+        });
 
-        hideView: function () {
-            this.downlistcombo.hideView();
-        },
+        this.downlistcombo.on(Combo.EVENT_BEFORE_POPUPVIEW, () => {
+            this.fireEvent(DownListCombo.EVENT_BEFORE_POPUPVIEW);
+        });
+    }
 
-        showView: function (e) {
-            this.downlistcombo.showView(e);
-        },
+    hideView() {
+        this.downlistcombo.hideView();
+    }
 
-        populate: function (items) {
-            this.popupView.populate(items);
-        },
+    showView(e) {
+        this.downlistcombo.showView(e);
+    }
 
-        setValue: function (v) {
-            this.popupView.setValue(v);
-        },
+    populate(items) {
+        this.popupView.populate(items);
+    }
 
-        getValue: function () {
-            return this.popupView.getValue();
-        },
+    setValue(v) {
+        this.popupView.setValue(v);
+    }
 
-        adjustWidth: function () {
-            this.downlistcombo.adjustWidth();
-        },
+    getValue() {
+        return this.popupView.getValue();
+    }
 
-        adjustHeight: function () {
-            this.downlistcombo.adjustHeight();
-        }
-    });
-    BI.DownListCombo.EVENT_CHANGE = "EVENT_CHANGE";
-    BI.DownListCombo.EVENT_SON_VALUE_CHANGE = "EVENT_SON_VALUE_CHANGE";
-    BI.DownListCombo.EVENT_BEFORE_POPUPVIEW = "EVENT_BEFORE_POPUPVIEW";
+    adjustWidth() {
+        this.downlistcombo.adjustWidth();
+    }
 
-    BI.shortcut("bi.down_list_combo", BI.DownListCombo);
-}());
+    adjustHeight() {
+        this.downlistcombo.adjustHeight();
+    }
+}
diff --git a/src/widget/downlist/group.downlist.js b/src/widget/downlist/group.downlist.js
index c7cc2ce49..2d06f83e0 100644
--- a/src/widget/downlist/group.downlist.js
+++ b/src/widget/downlist/group.downlist.js
@@ -1,51 +1,62 @@
-/**
- * Created by roy on 15/9/6.
- */
-BI.DownListGroup = BI.inherit(BI.Widget, {
-    constants: {
-        iconCls: "check-mark-ha-font"
-    },
-    _defaultConfig: function () {
-        return BI.extend(BI.DownListGroup.superclass._defaultConfig.apply(this, arguments), {
-            baseCls: "bi-down-list-group",
-            items: [
-                {
-                    el: {}
-                }
-            ]
-        });
-    },
-    _init: function () {
-        BI.DownListGroup.superclass._init.apply(this, arguments);
-        var o = this.options, self = this;
-
-        this.downlistgroup = BI.createWidget({
-            element: this,
-            type: "bi.button_tree",
-            items: o.items,
-            chooseType: 0, // 0单选，1多选
-            layouts: [{
-                type: "bi.vertical",
-                hgap: 0,
-                vgap: 0
-            }],
-            value: o.value
-        });
-        this.downlistgroup.on(BI.Controller.EVENT_CHANGE, function (type) {
-            self.fireEvent(BI.Controller.EVENT_CHANGE, arguments);
-            if(type === BI.Events.CLICK) {
-                self.fireEvent(BI.DownListGroup.EVENT_CHANGE, arguments);
-            }
-        });
-    },
-    getValue: function () {
-        return this.downlistgroup.getValue();
-    },
-    setValue: function (v) {
-        this.downlistgroup.setValue(v);
-    }
-
-
-});
-BI.DownListGroup.EVENT_CHANGE = "EVENT_CHANGE";
-BI.shortcut("bi.down_list_group", BI.DownListGroup);
\ No newline at end of file
+import {
+    shortcut,
+    Widget,
+    extend,
+    createWidget,
+    Controller,
+    Events
+} from "@/core";
+
+@shortcut()
+export class DownListGroup extends Widget {
+  static xtype = "bi.down_list_group";
+
+  constants = { iconCls: "check-mark-ha-font" };
+
+  static EVENT_CHANGE = "EVENT_CHANGE";
+
+  _defaultConfig() {
+      return extend(super._defaultConfig(...arguments), {
+          baseCls: "bi-down-list-group",
+          items: [
+              {
+                  el: {},
+              }
+          ],
+      });
+  }
+
+  _init() {
+      super._init(...arguments);
+      const o = this.options;
+
+      this.downlistgroup = createWidget({
+          element: this,
+          type: "bi.button_tree",
+          items: o.items,
+          chooseType: 0, // 0单选，1多选
+          layouts: [
+              {
+                  type: "bi.vertical",
+                  hgap: 0,
+                  vgap: 0,
+              }
+          ],
+          value: o.value,
+      });
+      this.downlistgroup.on(Controller.EVENT_CHANGE, (type, ...args) => {
+          this.fireEvent(Controller.EVENT_CHANGE, type, ...args);
+          if (type === Events.CLICK) {
+              this.fireEvent(DownListGroup.EVENT_CHANGE, type, ...args);
+          }
+      });
+  }
+
+  getValue() {
+      return this.downlistgroup.getValue();
+  }
+
+  setValue(v) {
+      this.downlistgroup.setValue(v);
+  }
+}
diff --git a/src/widget/downlist/index.js b/src/widget/downlist/index.js
new file mode 100644
index 000000000..07a86df06
--- /dev/null
+++ b/src/widget/downlist/index.js
@@ -0,0 +1,5 @@
+export { DownListGroup } from "./group.downlist";
+export { DownListItem } from "./item.downlist";
+export { DownListGroupItem } from "./item.downlistgroup";
+export { DownListPopup } from "./popup.downlist";
+export { DownListCombo } from "./combo.downlist";
diff --git a/src/widget/downlist/item.downlist.js b/src/widget/downlist/item.downlist.js
index 531806ca0..1a1598490 100644
--- a/src/widget/downlist/item.downlist.js
+++ b/src/widget/downlist/item.downlist.js
@@ -1,102 +1,125 @@
-BI.DownListItem = BI.inherit(BI.BasicButton, {
-    _defaultConfig: function () {
-        var conf = BI.DownListItem.superclass._defaultConfig.apply(this, arguments);
-        return BI.extend(conf, {
-            baseCls: "bi-down-list-item bi-list-item-active",
-            cls: "",
-            height: BI.SIZE_CONSANTS.LIST_ITEM_HEIGHT,
-            logic: {
-                dynamic: true
-            },
-            selected: false,
-            iconHeight: null,
-            iconWidth: null,
-            textHgap: 0,
-            textVgap: 0,
-            textLgap: 0,
-            textRgap: 0
-        });
-    },
-    _init: function () {
-        BI.DownListItem.superclass._init.apply(this, arguments);
-        var self = this, o = this.options;
-        this.text = BI.createWidget({
-            type: "bi.label",
-            cls: "list-item-text",
-            textAlign: "left",
-            hgap: o.textHgap,
-            vgap: o.textVgap,
-            lgap: o.textLgap,
-            rgap: o.textRgap,
-            text: o.text,
-            value: o.value,
-            keyword: o.keyword,
-            height: o.height
-        });
-
-
-        var icon = BI.isPlainObject(o.icon) ? o.icon : {
-            type: "bi.icon",
-            width: o.iconWidth,
-            height: o.iconHeight,
-        }
-
-        this.icon = BI.createWidget({
-            type: "bi.center_adapt",
-            width: 36,
-            height: o.height,
-            items: [{
-                el: icon,
-            }],
-        });
-
-        BI.createWidget(BI.extend({
-            element: this
-        }, BI.LogicFactory.createLogic(BI.LogicFactory.createLogicTypeByDirection(BI.Direction.Left), BI.extend(o.logic, {
-            items: BI.LogicFactory.createLogicItemsByDirection(BI.Direction.Left, this.icon, this.text)
-        }))));
-    },
-
-    setValue: function () {
-        if (!this.isReadOnly()) {
-            this.text.setValue.apply(this.text, arguments);
-        }
-    },
-
-    getValue: function () {
-        return this.text.getValue();
-    },
-
-    setText: function () {
-        this.text.setText.apply(this.text, arguments);
-    },
-
-    getText: function () {
-        return this.text.getText();
-    },
-
-    doClick: function () {
-        BI.DownListItem.superclass.doClick.apply(this, arguments);
-        if (this.isValid()) {
-            this.fireEvent(BI.DownListItem.EVENT_CHANGE, this.getValue(), this);
-        }
-    },
-
-    doRedMark: function () {
-        this.text.doRedMark.apply(this.text, arguments);
-    },
-
-    unRedMark: function () {
-        this.text.unRedMark.apply(this.text, arguments);
-    },
-
-    doHighLight: function () {
-        this.text.doHighLight.apply(this.text, arguments);
-    },
-
-    unHighLight: function () {
-        this.text.unHighLight.apply(this.text, arguments);
-    }
-});
-BI.DownListItem.EVENT_CHANGE = "EVENT_CHANGE";
-BI.shortcut("bi.down_list_item", BI.DownListItem);
\ No newline at end of file
+import { shortcut, extend, createWidget, isPlainObject, LogicFactory, Direction } from "@/core";
+import { BasicButton } from "@/base";
+
+@shortcut()
+export class DownListItem extends BasicButton {
+  static xtype = "bi.down_list_item";
+
+  static EVENT_CHANGE = "EVENT_CHANGE";
+
+  _defaultConfig() {
+      const conf = super._defaultConfig(...arguments);
+      
+      return extend(conf, {
+          baseCls: "bi-down-list-item bi-list-item-active",
+          cls: "",
+          height: BI.SIZE_CONSANTS.LIST_ITEM_HEIGHT,
+          logic: {
+              dynamic: true,
+          },
+          selected: false,
+          iconHeight: null,
+          iconWidth: null,
+          textHgap: 0,
+          textVgap: 0,
+          textLgap: 0,
+          textRgap: 0,
+      });
+  }
+
+  _init() {
+      super._init(...arguments);
+      const o = this.options;
+      this.text = createWidget({
+          type: "bi.label",
+          cls: "list-item-text",
+          textAlign: "left",
+          hgap: o.textHgap,
+          vgap: o.textVgap,
+          lgap: o.textLgap,
+          rgap: o.textRgap,
+          text: o.text,
+          value: o.value,
+          keyword: o.keyword,
+          height: o.height,
+      });
+
+      const icon = isPlainObject(o.icon)
+          ? o.icon
+          : {
+              type: "bi.icon",
+              width: o.iconWidth,
+              height: o.iconHeight,
+          };
+
+      this.icon = createWidget({
+          type: "bi.center_adapt",
+          width: 36,
+          height: o.height,
+          items: [
+              {
+                  el: icon,
+              }
+          ],
+      });
+
+      createWidget(
+          extend(
+              {
+                  element: this,
+              },
+              LogicFactory.createLogic(
+                  LogicFactory.createLogicTypeByDirection(Direction.Left),
+                  extend(o.logic, {
+                      items: LogicFactory.createLogicItemsByDirection(
+                          Direction.Left,
+                          this.icon,
+                          this.text
+                      ),
+                  })
+              )
+          )
+      );
+  }
+
+  setValue() {
+      if (!this.isReadOnly()) {
+          this.text.setValue(...arguments);
+      }
+  }
+
+  getValue() {
+      return this.text.getValue();
+  }
+
+  setText() {
+      this.text.setText(...arguments);
+  }
+
+  getText() {
+      return this.text.getText();
+  }
+
+  doClick() {
+      super.doClick(...arguments);
+      if (this.isValid()) {
+          this.fireEvent(DownListItem.EVENT_CHANGE, this.getValue(), this);
+      }
+  }
+
+  doRedMark() {
+      this.text.doRedMark(...arguments);
+  }
+
+  unRedMark() {
+      this.text.unRedMark(...arguments);
+  }
+
+  doHighLight() {
+      this.text.doHighLight(...arguments);
+  }
+
+  unHighLight() {
+      this.text.unHighLight(...arguments);
+  }
+}
diff --git a/src/widget/downlist/item.downlistgroup.js b/src/widget/downlist/item.downlistgroup.js
index df4a09ac7..d2c9d14a7 100644
--- a/src/widget/downlist/item.downlistgroup.js
+++ b/src/widget/downlist/item.downlistgroup.js
@@ -1,118 +1,141 @@
-BI.DownListGroupItem = BI.inherit(BI.BasicButton, {
-    _defaultConfig: function () {
-        var conf = BI.DownListGroupItem.superclass._defaultConfig.apply(this, arguments);
-        return BI.extend(conf, {
-            baseCls: (conf.baseCls || "") + " bi-down-list-group-item",
-            logic: {
-                dynamic: false
-            },
-            // invalid: true,
-            iconCls1: "dot-e-font",
-            icon: "",
-            iconCls2: "pull-right-e-font"
-        });
-    },
-    render: function () {
-        var o = this.options;
-        var self = this;
-        this.text = BI.createWidget({
-            type: "bi.label",
-            cls: "list-group-item-text",
-            textAlign: "left",
-            text: o.text,
-            value: o.value,
-            height: o.height,
-        });
-
-        if (BI.isPlainObject(o.icon)) {
-            this.icon1 = BI.createWidget({
-                width: 36,
-                height: o.height,
-                type: "bi.center_adapt",
-                items: [o.icon],
-            });
-        } else {
-            this.icon1 = BI.createWidget({
-                type: "bi.icon_button",
-                cls: o.iconCls1,
-                width: 36,
-                height: o.height,
-                iconHeight: o.iconHeight,
-                iconWidth: 36,
-                disableSelected: true,
-                selected: this._digest(o.value),
-            });
-        }
-
-        this.icon2 = BI.createWidget({
-            type: "bi.icon_button",
-            cls: o.iconCls2,
-            width: 24,
-            forceNotSelected: true
-        });
-
-        this.element.hover(function () {
-            if (self.isEnabled()) {
-                self.hover();
-            }
-        }, function () {
-            if (self.isEnabled()) {
-                self.dishover();
-            }
-        });
-
-        return {
-            type: "bi.horizontal_fill",
-            columnSize: [36,  "fill", 24],
-            items: [this.icon1, this.text, this.icon2]
-        }
-    },
-
-    _getLevel: function () {
-        var child = BI.first(this.options.childValues);
-        return BI.isNotNull(child) ? (child + "").split(BI.BlankSplitChar).length : 0;
-    },
-
-    _digest: function (v) {
-        var self = this, o = this.options;
-        v = BI.isArray(v) ? v : [v];
-        var level = this._getLevel();
-        return BI.any(v, function (idx, value) {
-            return BI.contains(o.childValues, (value + "").split(BI.BlankSplitChar).slice(0, level).join(BI.BlankSplitChar));
-        });
-    },
-
-    hover: function () {
-        BI.DownListGroupItem.superclass.hover.apply(this, arguments);
-        this.icon1.element.addClass("hover");
-        this.icon2.element.addClass("hover");
-
-    },
-
-    dishover: function () {
-        BI.DownListGroupItem.superclass.dishover.apply(this, arguments);
-        this.icon1.element.removeClass("hover");
-        this.icon2.element.removeClass("hover");
-    },
-
-    doClick: function () {
-        BI.DownListGroupItem.superclass.doClick.apply(this, arguments);
-        if (this.isValid()) {
-            this.fireEvent(BI.DownListGroupItem.EVENT_CHANGE, this.getValue());
-        }
-    },
-
-    doRedMark: function () {
-        this.text.doRedMark.apply(this.text, arguments);
-    },
-
-    unRedMark: function () {
-        this.text.unRedMark.apply(this.text, arguments);
-    },
-
-    setValue: function (v) {
-        this.icon1.setSelected && this.icon1.setSelected(this._digest(v));
-    },
-});
-BI.DownListGroupItem.EVENT_CHANGE = "EVENT_CHANGE";
-BI.shortcut("bi.down_list_group_item", BI.DownListGroupItem);
+import {
+    shortcut,
+    extend,
+    createWidget,
+    isNotNull,
+    isArray,
+    any,
+    contains,
+    isPlainObject,
+    first,
+    BlankSplitChar
+} from "@/core";
+import { BasicButton } from "@/base";
+
+@shortcut()
+export class DownListGroupItem extends BasicButton {
+  static xtype = "bi.down_list_group_item";
+
+  static EVENT_CHANGE = "EVENT_CHANGE";
+
+  _defaultConfig() {
+      const conf = super._defaultConfig(...arguments);
+      
+      return extend(conf, {
+          baseCls: `${conf.baseCls || ""} bi-down-list-group-item`,
+          logic: {
+              dynamic: false,
+          },
+          // invalid: true,
+          iconCls1: "dot-e-font",
+          icon: "",
+          iconCls2: "pull-right-e-font",
+      });
+  }
+
+  render() {
+      const o = this.options;
+      this.text = createWidget({
+          type: "bi.label",
+          cls: "list-group-item-text",
+          textAlign: "left",
+          text: o.text,
+          value: o.value,
+          height: o.height,
+      });
+
+      if (isPlainObject(o.icon)) {
+          this.icon1 = createWidget({
+              width: 36,
+              height: o.height,
+              type: "bi.center_adapt",
+              items: [o.icon],
+          });
+      } else {
+          this.icon1 = createWidget({
+              type: "bi.icon_button",
+              cls: o.iconCls1,
+              width: 36,
+              height: o.height,
+              iconHeight: o.iconHeight,
+              iconWidth: 36,
+              disableSelected: true,
+              selected: this._digest(o.value),
+          });
+      }
+
+      this.icon2 = createWidget({
+          type: "bi.icon_button",
+          cls: o.iconCls2,
+          width: 24,
+          forceNotSelected: true,
+      });
+
+      this.element.hover(
+          () => {
+              if (this.isEnabled()) {
+                  this.hover();
+              }
+          },
+          () => {
+              if (this.isEnabled()) {
+                  this.dishover();
+              }
+          }
+      );
+
+      return {
+          type: "bi.horizontal_fill",
+          columnSize: [36, "fill", 24],
+          items: [this.icon1, this.text, this.icon2],
+      };
+  }
+
+  _getLevel() {
+      const child = first(this.options.childValues);
+      
+      return isNotNull(child) ? (`${child}`).split(BlankSplitChar).length : 0;
+  }
+
+  _digest(v) {
+      const o = this.options;
+      v = isArray(v) ? v : [v];
+      const level = this._getLevel();
+      
+      return any(v, (idx, value) => contains(
+          o.childValues,
+          (`${value}`).split(BlankSplitChar).slice(0, level).join(BlankSplitChar)
+      ));
+  }
+
+  hover() {
+      super.hover(...arguments);
+      this.icon1.element.addClass("hover");
+      this.icon2.element.addClass("hover");
+  }
+
+  dishover() {
+      super.dishover(...arguments);
+      this.icon1.element.removeClass("hover");
+      this.icon2.element.removeClass("hover");
+  }
+
+  doClick() {
+      super.doClick(...arguments);
+      if (this.isValid()) {
+          this.fireEvent(DownListGroupItem.EVENT_CHANGE, this.getValue());
+      }
+  }
+
+  doRedMark() {
+      this.text.doRedMark(...arguments);
+  }
+
+  unRedMark() {
+      this.text.unRedMark(...arguments);
+  }
+
+  setValue(v) {
+      this.icon1.setSelected && this.icon1.setSelected(this._digest(v));
+  }
+}
diff --git a/src/widget/downlist/popup.downlist.js b/src/widget/downlist/popup.downlist.js
index 0e802a695..9ca7e0edd 100644
--- a/src/widget/downlist/popup.downlist.js
+++ b/src/widget/downlist/popup.downlist.js
@@ -1,301 +1,332 @@
-/**
- * Created by roy on 15/9/8.
- * 处理popup中的item分组样式
- * 一个item分组中的成员大于一时，该分组设置为单选，并且默认状态第一个成员设置为已选择项
- */
-BI.DownListPopup = BI.inherit(BI.Pane, {
-    constants: {
-        nextIcon: "pull-right-e-font",
-        height: 24,
-        iconHeight: 12,
-        iconWidth: 12,
-        hgap: 0,
-        vgap: 0,
-        border: 1
-    },
-    _defaultConfig: function () {
-        var conf = BI.DownListPopup.superclass._defaultConfig.apply(this, arguments);
-        return BI.extend(conf, {
-            baseCls: "bi-down-list-popup",
-            items: [],
-            chooseType: BI.Selection.Multi
-        });
-    },
-    _init: function () {
-        BI.DownListPopup.superclass._init.apply(this, arguments);
-        this.singleValues = [];
-        this.childValueMap = {};
-        this.fatherValueMap = {};
-        this.items = [];
-        var self = this, o = this.options, children = this._createPopupItems(o.items);
-        this.popup = BI.createWidget({
-            type: "bi.button_tree",
-            items: BI.createItems(children,
-                {}, {
-                    adjustLength: -2
-                }
-            ),
-            layouts: [{
-                type: "bi.vertical",
-                hgap: this.constants.hgap,
-                vgap: this.constants.vgap
-            }],
-            value: this._digest(o.value),
-            chooseType: o.chooseType
-        });
+import {
+    shortcut,
+    extend,
+    createWidget,
+    createItems,
+    isNotNull,
+    contains,
+    each,
+    isEmpty,
+    map,
+    isNotEmptyString,
+    isNotEmptyArray,
+    some,
+    deepClone
+} from "@/core";
+import { Pane, ButtonTree } from "@/base";
 
-        this.popup.on(BI.ButtonTree.EVENT_CHANGE, function (value, object) {
-            var changedValue = value;
-            if (BI.isNotNull(self.childValueMap[value])) {
-                changedValue = self.childValueMap[value];
-                self.fireEvent(BI.DownListPopup.EVENT_SON_VALUE_CHANGE, changedValue, self.fatherValueMap[value]);
-            } else {
-                self.fireEvent(BI.DownListPopup.EVENT_CHANGE, changedValue, object);
-            }
+@shortcut()
+export class DownListPopup extends Pane {
+  static xtype = "bi.down_list_popup";
 
+  constants = {
+      nextIcon: "pull-right-e-font",
+      height: 24,
+      iconHeight: 12,
+      iconWidth: 12,
+      hgap: 0,
+      vgap: 0,
+      border: 1,
+  };
 
-            if (!BI.contains(self.singleValues, changedValue)) {
-                var item = self.getValue();
-                var result = [];
-                BI.each(item, function (i, valueObject) {
-                    if (valueObject.value != changedValue) {
-                        result.push(valueObject);
-                    }
-                });
-                self.setValue(result);
-            }
+  static EVENT_CHANGE = "EVENT_CHANGE";
+  static EVENT_SON_VALUE_CHANGE = "EVENT_SON_VALUE_CHANGE";
 
-        });
+  _defaultConfig() {
+      const conf = super._defaultConfig(...arguments);
+      
+      return extend(conf, {
+          baseCls: "bi-down-list-popup",
+          items: [],
+          chooseType: Selection.Multi,
+      });
+  }
 
-        BI.createWidget({
-            type: "bi.vertical",
-            element: this,
-            items: [this.popup],
-            vgap: 5
-        });
+  _init() {
+      super._init(...arguments);
+      this.singleValues = [];
+      this.childValueMap = {};
+      this.fatherValueMap = {};
+      this.items = [];
+      const o = this.options,
+          children = this._createPopupItems(o.items);
+      this.popup = createWidget({
+          type: "bi.button_tree",
+          items: createItems(
+              children,
+              {},
+              {
+                  adjustLength: -2,
+              }
+          ),
+          layouts: [
+              {
+                  type: "bi.vertical",
+                  hgap: this.constants.hgap,
+                  vgap: this.constants.vgap,
+              }
+          ],
+          value: this._digest(o.value),
+          chooseType: o.chooseType,
+      });
 
-    },
-    _createPopupItems: function (items) {
-        var self = this, result = [];
-        // 不能修改populate进来的item的引用
-        BI.each(items, function (i, it) {
-            var item_done = {
-                type: "bi.down_list_group",
-                items: []
-            };
+      this.popup.on(ButtonTree.EVENT_CHANGE, (value, object) => {
+          let changedValue = value;
+          if (isNotNull(this.childValueMap[value])) {
+              changedValue = this.childValueMap[value];
+              this.fireEvent(
+                  DownListPopup.EVENT_SON_VALUE_CHANGE,
+                  changedValue,
+                  this.fatherValueMap[value]
+              );
+          } else {
+              this.fireEvent(DownListPopup.EVENT_CHANGE, changedValue, object);
+          }
 
-            var storeItem = [];
+          if (!contains(this.singleValues, changedValue)) {
+              const item = this.getValue();
+              const result = [];
+              each(item, (i, valueObject) => {
+                  if (valueObject.value !== changedValue) {
+                      result.push(valueObject);
+                  }
+              });
+              this.setValue(result);
+          }
+      });
 
-            BI.each(it, function (i, sourceItem) {
-                var item = BI.extend({}, sourceItem);
-                if (BI.isNotEmptyArray(sourceItem.children) && !BI.isEmpty(sourceItem.el)) {
-                    item.type = "bi.combo_group";
-                    // popup未初始化返回的是options中的value, 在经过buttontree的getValue concat之后，无法区分值来自options
-                    // 还是item自身, 这边控制defaultInit为true来避免这个问题
-                    item.isDefaultInit = true;
-                    item.cls = "down-list-group";
-                    item.trigger = "hover";
-                    item.isNeedAdjustWidth = false;
-                    item.el = sourceItem.el;
-                    item.el.title = sourceItem.el.title || sourceItem.el.text;
-                    item.el.type = "bi.down_list_group_item";
-                    item.el.logic = {
-                        dynamic: true
-                    };
-                    item.el.height = sourceItem.el.height || BI.SIZE_CONSANTS.LIST_ITEM_HEIGHT;
-                    item.el.iconCls2 = self.constants.nextIcon;
-                    item.popup = {
-                        lgap: 1,
-                        el: {
-                            type: "bi.button_tree",
-                            chooseType: 0,
-                            layouts: [{
-                                type: "bi.vertical"
-                            }]
+      createWidget({
+          type: "bi.vertical",
+          element: this,
+          items: [this.popup],
+          vgap: 5,
+      });
+  }
 
-                        },
-                        innerVgap: 5,
-                        maxHeight: 378
-                    };
-                    self._createChildren(item, sourceItem);
-                } else {
-                    item.type = sourceItem.type || "bi.down_list_item";
-                    item.title = sourceItem.title || sourceItem.text;
-                    item.textRgap = 10;
-                    item.isNeedAdjustWidth = false;
-                    item.logic = {
-                        dynamic: true
-                    };
-                }
-                var el_done = {};
-                el_done.el = item;
-                item_done.items.push(el_done);
-                storeItem.push(item);
-            });
-            if (self._isGroup(item_done.items)) {
-                BI.each(item_done.items, function (i, item) {
-                    self.singleValues.push(item.el.value);
-                });
-            }
+  _createPopupItems(items) {
+      const result = [];
+      // 不能修改populate进来的item的引用
+      each(items, (i, it) => {
+          const item_done = {
+              type: "bi.down_list_group",
+              items: [],
+          };
 
-            result.push(item_done);
-            self.items.push(storeItem);
-            if (self._needSpliter(i, items.length)) {
-                var spliter_container = BI.createWidget({
-                    type: "bi.vertical",
-                    items: [{
-                        el: {
-                            type: "bi.layout",
-                            cls: "bi-down-list-spliter bi-split-top cursor-pointer",
-                            height: 0
-                        }
+          const storeItem = [];
 
-                    }],
-                    cls: "bi-down-list-spliter-container cursor-pointer",
-                    vgap: 5,
-                    hgap: 12
-                });
-                result.push(spliter_container);
-            }
-        });
-        return result;
-    },
+          each(it, (i, sourceItem) => {
+              const item = extend({}, sourceItem);
+              if (isNotEmptyArray(sourceItem.children) && !isEmpty(sourceItem.el)) {
+                  item.type = "bi.combo_group";
+                  // popup未初始化返回的是options中的value, 在经过buttontree的getValue concat之后，无法区分值来自options
+                  // 还是item自身, 这边控制defaultInit为true来避免这个问题
+                  item.isDefaultInit = true;
+                  item.cls = "down-list-group";
+                  item.trigger = "hover";
+                  item.isNeedAdjustWidth = false;
+                  item.el = sourceItem.el;
+                  item.el.title = sourceItem.el.title || sourceItem.el.text;
+                  item.el.type = "bi.down_list_group_item";
+                  item.el.logic = {
+                      dynamic: true,
+                  };
+                  item.el.height =
+            sourceItem.el.height || BI.SIZE_CONSANTS.LIST_ITEM_HEIGHT;
+                  item.el.iconCls2 = this.constants.nextIcon;
+                  item.popup = {
+                      lgap: 1,
+                      el: {
+                          type: "bi.button_tree",
+                          chooseType: 0,
+                          layouts: [
+                              {
+                                  type: "bi.vertical",
+                              }
+                          ],
+                      },
+                      innerVgap: 5,
+                      maxHeight: 378,
+                  };
+                  this._createChildren(item, sourceItem);
+              } else {
+                  item.type = sourceItem.type || "bi.down_list_item";
+                  item.title = sourceItem.title || sourceItem.text;
+                  item.textRgap = 10;
+                  item.isNeedAdjustWidth = false;
+                  item.logic = {
+                      dynamic: true,
+                  };
+              }
+              const el_done = {};
+              el_done.el = item;
+              item_done.items.push(el_done);
+              storeItem.push(item);
+          });
+          if (this._isGroup(item_done.items)) {
+              each(item_done.items, (i, item) => {
+                  this.singleValues.push(item.el.value);
+              });
+          }
 
-    _createChildren: function (targetItem, sourceItem) {
-        var self = this;
-        targetItem.el.childValues = [];
-        targetItem.items = targetItem.children = [];
-        BI.each(sourceItem.children, function (i, child) {
-            var item = BI.extend({}, child);
-            var fatherValue = BI.deepClone(targetItem.el.value);
-            var childValue = BI.deepClone(item.value);
-            self.singleValues.push(item.value);
-            item.type = item.type || "bi.down_list_item";
-            item.extraCls = " child-down-list-item";
-            item.title = item.title || item.text;
-            item.textRgap = 10;
-            item.isNeedAdjustWidth = false;
-            item.logic = {
-                dynamic: true
-            };
-            item.father = fatherValue;
-            item.childValue = item.value;
-            self.fatherValueMap[self._createChildValue(fatherValue, childValue)] = fatherValue;
-            self.childValueMap[self._createChildValue(fatherValue, childValue)] = childValue;
-            item.value = self._createChildValue(fatherValue, childValue);
-            targetItem.el.childValues.push(item.value);
-            targetItem.items.push(item);
-        });
-    },
+          result.push(item_done);
+          this.items.push(storeItem);
+          if (this._needSpliter(i, items.length)) {
+              const spliter_container = createWidget({
+                  type: "bi.vertical",
+                  items: [
+                      {
+                          el: {
+                              type: "bi.layout",
+                              cls: "bi-down-list-spliter bi-split-top cursor-pointer",
+                              height: 0,
+                          },
+                      }
+                  ],
+                  cls: "bi-down-list-spliter-container cursor-pointer",
+                  vgap: 5,
+                  hgap: 12,
+              });
+              result.push(spliter_container);
+          }
+      });
+      
+      return result;
+  }
 
-    _isGroup: function (i) {
-        return i.length > 1;
-    },
+  _createChildren(targetItem, sourceItem) {
+      targetItem.el.childValues = [];
+      targetItem.items = targetItem.children = [];
+      each(sourceItem.children, (i, child) => {
+          const item = extend({}, child);
+          const fatherValue = deepClone(targetItem.el.value);
+          const childValue = deepClone(item.value);
+          this.singleValues.push(item.value);
+          item.type = item.type || "bi.down_list_item";
+          item.extraCls = " child-down-list-item";
+          item.title = item.title || item.text;
+          item.textRgap = 10;
+          item.isNeedAdjustWidth = false;
+          item.logic = {
+              dynamic: true,
+          };
+          item.father = fatherValue;
+          item.childValue = item.value;
+          this.fatherValueMap[this._createChildValue(fatherValue, childValue)] =
+        fatherValue;
+          this.childValueMap[this._createChildValue(fatherValue, childValue)] =
+        childValue;
+          item.value = this._createChildValue(fatherValue, childValue);
+          targetItem.el.childValues.push(item.value);
+          targetItem.items.push(item);
+      });
+  }
 
-    _needSpliter: function (i, itemLength) {
-        return i < itemLength - 1;
-    },
+  _isGroup(i) {
+      return i.length > 1;
+  }
 
-    _createChildValue: function (fatherValue, childValue) {
-        return fatherValue + BI.BlankSplitChar + childValue;
-    },
+  _needSpliter(i, itemLength) {
+      return i < itemLength - 1;
+  }
 
-    _digest: function (valueItem) {
-        var self = this;
-        var valueArray = [];
-        BI.each(valueItem, function (i, item) {
-                var value;
-                if (BI.isNotNull(item.childValue)) {
-                    value = self._createChildValue(item.value, item.childValue);
-                } else {
-                    value = item.value;
-                }
-                valueArray.push(value);
-            }
-        );
-        return valueArray;
-    },
+  _createChildValue(fatherValue, childValue) {
+      return fatherValue + BI.BlankSplitChar + childValue;
+  }
 
-    _checkValues: function (values) {
-        var value = [];
-        BI.each(this.items, function (idx, itemGroup) {
-            BI.each(itemGroup, function (id, item) {
-                if(BI.isNotNull(item.children)) {
-                    var childValues = BI.map(item.children, "value");
-                    var v = joinValue(childValues, values[idx]);
-                    if(BI.isNotEmptyString(v)) {
-                        value.push(v);
-                    }
-                }else{
-                    if(item.value === values[idx][0]) {
-                        value.push(values[idx][0]);
-                    }
-                }
-            });
-        });
-        return value;
+  _digest(valueItem) {
+      const valueArray = [];
+      each(valueItem, (i, item) => {
+          let value;
+          if (isNotNull(item.childValue)) {
+              value = this._createChildValue(item.value, item.childValue);
+          } else {
+              value = item.value;
+          }
+          valueArray.push(value);
+      });
+      
+      return valueArray;
+  }
 
-        function joinValue (sources, targets) {
-            var value = "";
-            BI.some(sources, function (idx, s) {
-                return BI.some(targets, function (id, t) {
-                    if(s === t) {
-                        value = s;
-                        return true;
-                    }
-                });
-            });
-            return value;
-        }
-    },
+  _checkValues(values) {
+      const value = [];
+      each(this.items, (idx, itemGroup) => {
+          each(itemGroup, (id, item) => {
+              if (isNotNull(item.children)) {
+                  const childValues = map(item.children, "value");
+                  const v = joinValue(childValues, values[idx]);
+                  if (isNotEmptyString(v)) {
+                      value.push(v);
+                  }
+              } else {
+                  if (item.value === values[idx][0]) {
+                      value.push(values[idx][0]);
+                  }
+              }
+          });
+      });
+      
+      return value;
 
-    populate: function (items) {
-        BI.DownListPopup.superclass.populate.apply(this, arguments);
-        this.items = [];
-        this.childValueMap = {};
-        this.fatherValueMap = {};
-        this.singleValues = [];
-        var children = this._createPopupItems(items);
-        var popupItem = BI.createItems(children,
-            {}, {
-                adjustLength: -2
-            }
-        );
-        this.popup.populate(popupItem);
-    },
+      function joinValue(sources, targets) {
+          let value = "";
+          some(sources, (idx, s) => some(targets, (id, t) => {
+              if (s === t) {
+                  value = s;
+                  
+                  return true;
+              }
+          }));
+          
+          return value;
+      }
+  }
 
-    setValue: function (valueItem) {
-        this.popup.setValue(this._digest(valueItem));
-    },
+  populate(items) {
+      super.populate(...arguments);
+      this.items = [];
+      this.childValueMap = {};
+      this.fatherValueMap = {};
+      this.singleValues = [];
+      const children = this._createPopupItems(items);
+      const popupItem = createItems(
+          children,
+          {},
+          {
+              adjustLength: -2,
+          }
+      );
+      this.popup.populate(popupItem);
+  }
 
-    _getValue: function () {
-        var v = [];
-        BI.each(this.popup.getAllButtons(), function (i, item) {
-            i % 2 === 0 && v.push(item.getValue());
-        });
-        return v;
-    },
+  setValue(valueItem) {
+      this.popup.setValue(this._digest(valueItem));
+  }
 
-    getValue: function () {
-        var self = this, result = [];
-        var values = this._checkValues(this._getValue());
-        BI.each(values, function (i, value) {
-            var valueItem = {};
-            if (BI.isNotNull(self.childValueMap[value])) {
-                var fartherValue = self.fatherValueMap[value];
-                valueItem.childValue = self.childValueMap[value];
-                valueItem.value = fartherValue;
-            } else {
-                valueItem.value = value;
-            }
-            result.push(valueItem);
-        });
-        return result;
-    }
+  _getValue() {
+      const v = [];
+      each(this.popup.getAllButtons(), (i, item) => {
+          i % 2 === 0 && v.push(item.getValue());
+      });
+      
+      return v;
+  }
 
-
-});
-
-BI.DownListPopup.EVENT_CHANGE = "EVENT_CHANGE";
-BI.DownListPopup.EVENT_SON_VALUE_CHANGE = "EVENT_SON_VALUE_CHANGE";
-BI.shortcut("bi.down_list_popup", BI.DownListPopup);
+  getValue() {
+      const result = [];
+      const values = this._checkValues(this._getValue());
+      each(values, (i, value) => {
+          const valueItem = {};
+          if (isNotNull(this.childValueMap[value])) {
+              const fartherValue = this.fatherValueMap[value];
+              valueItem.childValue = this.childValueMap[value];
+              valueItem.value = fartherValue;
+          } else {
+              valueItem.value = value;
+          }
+          result.push(valueItem);
+      });
+      
+      return result;
+  }
+}
diff --git a/src/widget/index.js b/src/widget/index.js
index 14146c7ae..874fd77cd 100644
--- a/src/widget/index.js
+++ b/src/widget/index.js
@@ -7,6 +7,9 @@ import * as datetimepane from "./datetimepane";
 import * as dynamicdatetime from "./dynamicdatetime";
 import * as time from "./time";
 import * as editor from "./editor";
+import * as downList from "./downlist";
+import * as singleSliderItem from "./singleslider";
+import * as intervalSliderItem from "./intervalslider";
 import { SelectTreeCombo } from "./selecttree/selecttree.combo";
 import { SingleTreeCombo } from "./singletree/singletree.combo";
 import { MultiTreeCombo } from "./multitree/multi.tree.combo";
@@ -27,6 +30,9 @@ Object.assign(BI, {
     ...dynamicdatetime,
     ...time,
     ...editor,
+    ...downList,
+    ...singleSliderItem,
+    ...intervalSliderItem,
     SelectTreeCombo,
     SingleTreeCombo,
     MultiTreeCombo,
@@ -48,6 +54,9 @@ export * from "./time";
 export * from "./editor";
 export * from "./multiselect";
 export * from "./multiselectlist";
+export * from "./downlist";
+export * from "./singleslider";
+export * from "./intervalslider";
 
 export {
     Collapse,
diff --git a/src/widget/intervalslider/index.js b/src/widget/intervalslider/index.js
new file mode 100644
index 000000000..2a99c23bd
--- /dev/null
+++ b/src/widget/intervalslider/index.js
@@ -0,0 +1,2 @@
+export { AccurateCalculationModel } from "./model.accuratecalculation";
+export { IntervalSlider } from "./intervalslider";
diff --git a/src/widget/intervalslider/intervalslider.js b/src/widget/intervalslider/intervalslider.js
index 59b1e1676..bd0121523 100644
--- a/src/widget/intervalslider/intervalslider.js
+++ b/src/widget/intervalslider/intervalslider.js
@@ -1,30 +1,50 @@
-/**
- * Created by zcf on 2016/9/26.
- */
-BI.IntervalSlider = BI.inherit(BI.Single, {
-    _constant: {
+import {
+    shortcut,
+    createWidget,
+    toPix,
+    parseFloat,
+    Layout,
+    AbsoluteLayout,
+    clamp,
+    VerticalLayout,
+    isEmptyString,
+    isNumeric,
+    isNull,
+    isInteger,
+    i18nText,
+    size,
+    parseInt,
+    isNotEmptyString,
+    MouseMoveTracker
+} from "@/core";
+import { Single, Editor } from "@/base";
+import { AccurateCalculationModel } from "./model.accuratecalculation";
+import { SignTextEditor, SliderIconButton } from "../singleslider";
+
+@shortcut()
+export class IntervalSlider extends Single {
+    static xtype = "bi.interval_slider";
+    _constant = {
         EDITOR_WIDTH: 58,
         EDITOR_R_GAP: 60,
         EDITOR_HEIGHT: 20,
         SLIDER_WIDTH_HALF: 15,
         SLIDER_WIDTH: 30,
         SLIDER_HEIGHT: 30,
-        TRACK_HEIGHT: 24
-    },
-
-    props: {
+        TRACK_HEIGHT: 24,
+    }
+    props = {
         baseCls: "bi-interval-slider bi-slider-track",
         digit: false,
         unit: "",
         min: 0,
         max: 100,
-        value: {
-            min: "",
-            max: "",
-        }
-    },
+        value: { min: "", max: "" },
+    };
 
-    beforeMount: function () {
+    static EVENT_CHANGE = "EVENT_CHANGE";
+
+    beforeMount() {
         const { value, min, max } = this.options;
         this._setMinAndMax({
             min,
@@ -32,90 +52,104 @@ BI.IntervalSlider = BI.inherit(BI.Single, {
         });
         this.setValue(value);
         this.populate();
-    },
-
-    render: function () {
+    }
 
-        var self = this;
-        var c = this._constant;
+    render() {
+        const c = this._constant;
         this.enable = false;
         this.valueOne = "";
         this.valueTwo = "";
 
-        this.calculation = new BI.AccurateCalculationModel();
-        this.grayTrack = BI.createWidget({
-            type: "bi.layout",
+        this.calculation = new AccurateCalculationModel();
+        this.grayTrack = createWidget({
+            type: Layout.xtype,
             cls: "gray-track",
-            height: 6
+            height: 6,
         });
-        this.blueTrack = BI.createWidget({
-            type: "bi.layout",
+        this.blueTrack = createWidget({
+            type: Layout.xtype,
             cls: "blue-track bi-high-light-background",
-            height: 6
+            height: 6,
         });
         this.track = this._createTrackWrapper();
 
-        this.labelOne = BI.createWidget({
-            type: "bi.sign_text_editor",
+        this.labelOne = createWidget({
+            type: SignTextEditor.xtype,
             cls: "slider-editor-button",
             text: this.options.unit,
             allowBlank: false,
-            width: BI.toPix(c.EDITOR_WIDTH, 2),
-            height: BI.toPix(c.EDITOR_HEIGHT, 2),
-            validationChecker: function (v) {
-                return self._checkValidation(v);
-            }
-        });
-        this.labelOne.element.hover(function () {
-            self.labelOne.element.removeClass("bi-border").addClass("bi-border");
-        }, function () {
-            self.labelOne.element.removeClass("bi-border");
+            width: toPix(c.EDITOR_WIDTH, 2),
+            height: toPix(c.EDITOR_HEIGHT, 2),
+            validationChecker: v => this._checkValidation(v),
         });
-        this.labelOne.on(BI.Editor.EVENT_CONFIRM, function () {
-            var oldValueOne = self.valueOne;
-            var v = BI.parseFloat(this.getValue());
-            self.valueOne = v;
-            var percent = self._getPercentByValue(v);
-            var significantPercent = BI.parseFloat(percent.toFixed(1));// 分成1000份
-            self._setSliderOnePosition(significantPercent);
-            self._setBlueTrack();
-            self._checkLabelPosition(oldValueOne, self.valueTwo, self.valueOne, self.valueTwo);
-            self.fireEvent(BI.IntervalSlider.EVENT_CHANGE);
+        this.labelOne.element.hover(
+            () => {
+                this.labelOne.element
+                    .removeClass("bi-border")
+                    .addClass("bi-border");
+            },
+            () => {
+                this.labelOne.element.removeClass("bi-border");
+            }
+        );
+        this.labelOne.on(Editor.EVENT_CONFIRM, () => {
+            const oldValueOne = this.valueOne;
+            const v = parseFloat(this.getValue());
+            this.valueOne = v;
+            const percent = this._getPercentByValue(v);
+            const significantPercent = parseFloat(percent.toFixed(1)); // 分成1000份
+            this._setSliderOnePosition(significantPercent);
+            this._setBlueTrack();
+            this._checkLabelPosition(
+                oldValueOne,
+                this.valueTwo,
+                this.valueOne,
+                this.valueTwo
+            );
+            this.fireEvent(IntervalSlider.EVENT_CHANGE);
         });
 
-        this.labelTwo = BI.createWidget({
-            type: "bi.sign_text_editor",
+        this.labelTwo = createWidget({
+            type: SignTextEditor.xtype,
             cls: "slider-editor-button",
             text: this.options.unit,
             allowBlank: false,
-            width: BI.toPix(c.EDITOR_WIDTH, 2),
-            height: BI.toPix(c.EDITOR_HEIGHT, 2),
-            validationChecker: function (v) {
-                return self._checkValidation(v);
-            }
-        });
-        this.labelTwo.element.hover(function () {
-            self.labelTwo.element.removeClass("bi-border").addClass("bi-border");
-        }, function () {
-            self.labelTwo.element.removeClass("bi-border");
+            width: toPix(c.EDITOR_WIDTH, 2),
+            height: toPix(c.EDITOR_HEIGHT, 2),
+            validationChecker: v => this._checkValidation(v),
         });
-        this.labelTwo.on(BI.Editor.EVENT_CONFIRM, function () {
-            var oldValueTwo = self.valueTwo;
-            var v = BI.parseFloat(this.getValue());
-            self.valueTwo = v;
-            var percent = self._getPercentByValue(v);
-            var significantPercent = BI.parseFloat(percent.toFixed(1));
-            self._setSliderTwoPosition(significantPercent);
-            self._setBlueTrack();
-            self._checkLabelPosition(self.valueOne, oldValueTwo, self.valueOne, self.valueTwo);
-            self.fireEvent(BI.IntervalSlider.EVENT_CHANGE);
+        this.labelTwo.element.hover(
+            () => {
+                this.labelTwo.element
+                    .removeClass("bi-border")
+                    .addClass("bi-border");
+            },
+            () => {
+                this.labelTwo.element.removeClass("bi-border");
+            }
+        );
+        this.labelTwo.on(Editor.EVENT_CONFIRM, () => {
+            const oldValueTwo = this.valueTwo;
+            const v = parseFloat(this.getValue());
+            this.valueTwo = v;
+            const percent = this._getPercentByValue(v);
+            const significantPercent = parseFloat(percent.toFixed(1));
+            this._setSliderTwoPosition(significantPercent);
+            this._setBlueTrack();
+            this._checkLabelPosition(
+                this.valueOne,
+                oldValueTwo,
+                this.valueOne,
+                this.valueTwo
+            );
+            this.fireEvent(IntervalSlider.EVENT_CHANGE);
         });
 
-        this.sliderOne = BI.createWidget({
-            type: "bi.single_slider_button"
+        this.sliderOne = createWidget({
+            type: SliderIconButton.xtype,
         });
-        this.sliderTwo = BI.createWidget({
-            type: "bi.single_slider_button"
+        this.sliderTwo = createWidget({
+            type: SliderIconButton.xtype,
         });
         this._draggable(this.sliderOne, true);
         this._draggable(this.sliderTwo, false);
@@ -127,7 +161,7 @@ BI.IntervalSlider = BI.inherit(BI.Single, {
             items: [
                 this._createLabelWrapper(),
                 {
-                    type: "bi.absolute",
+                    type: AbsoluteLayout.xtype,
                     items: [
                         {
                             el: {
@@ -135,75 +169,95 @@ BI.IntervalSlider = BI.inherit(BI.Single, {
                                 horizontalAlign: "stretch",
                                 verticalAlign: "middle",
                                 columnSize: ["fill"],
-                                items: [{
-                                    el: this.track,
-                                }],
+                                items: [
+                                    {
+                                        el: this.track,
+                                    }
+                                ],
                                 hgap: 10,
                             },
-                            inset: 0
+                            inset: 0,
                         },
-                        this._createSliderWrapper(),
-                    ]
+                        this._createSliderWrapper()
+                    ],
                 }
-            ]
+            ],
         };
-    },
+    }
 
-    _rePosBySizeAfterMove: function (size, isLeft) {
-        var o = this.options;
-        var percent = size * 100 / (this._getGrayTrackLength());
-        var significantPercent = BI.parseFloat(percent.toFixed(1));
-        var v = this._getValueByPercent(significantPercent);
+    _rePosBySizeAfterMove(size, isLeft) {
+        const o = this.options;
+        const percent = (size * 100) / this._getGrayTrackLength();
+        const significantPercent = parseFloat(percent.toFixed(1));
+        let v = this._getValueByPercent(significantPercent);
         v = this._assertValue(v);
         v = o.digit === false ? v : v.toFixed(o.digit);
-        var oldValueOne = this.valueOne, oldValueTwo = this.valueTwo;
-        if(isLeft) {
+        const oldValueOne = this.valueOne,
+            oldValueTwo = this.valueTwo;
+        if (isLeft) {
             this._setSliderOnePosition(significantPercent);
             this.labelOne.setValue(v);
             this.valueOne = v;
-            this._checkLabelPosition(oldValueOne, oldValueTwo, v, this.valueTwo);
-        }else{
+            this._checkLabelPosition(
+                oldValueOne,
+                oldValueTwo,
+                v,
+                this.valueTwo
+            );
+        } else {
             this._setSliderTwoPosition(significantPercent);
             this.labelTwo.setValue(v);
             this.valueTwo = v;
-            this._checkLabelPosition(oldValueOne, oldValueTwo, this.valueOne, v);
+            this._checkLabelPosition(
+                oldValueOne,
+                oldValueTwo,
+                this.valueOne,
+                v
+            );
         }
         this._setBlueTrack();
-    },
-
-    _rePosBySizeAfterStop: function (size, isLeft) {
-        var percent = size * 100 / (this._getGrayTrackLength());
-        var significantPercent = BI.parseFloat(percent.toFixed(1));
-        isLeft ? this._setSliderOnePosition(significantPercent) : this._setSliderTwoPosition(significantPercent);
-    },
-
-    _draggable: function (widget, isLeft) {
-        var self = this, o = this.options;
-        var startDrag = false;
-        var size = 0, offset = 0, defaultSize = 0;
-        var mouseMoveTracker = new BI.MouseMoveTracker(function (deltaX) {
-            if (mouseMoveTracker.isDragging()) {
-                startDrag = true;
-                offset += deltaX;
-                size = optimizeSize(defaultSize + offset);
-                widget.element.addClass("dragging");
-                self._rePosBySizeAfterMove(size, isLeft);
-            }
-        }, function () {
-            if (startDrag === true) {
-                size = optimizeSize(size);
-                self._rePosBySizeAfterStop(size, isLeft);
-                size = 0;
-                offset = 0;
-                defaultSize = size;
-                startDrag = false;
-            }
-            widget.element.removeClass("dragging");
-            mouseMoveTracker.releaseMouseMoves();
-            self.fireEvent(BI.IntervalSlider.EVENT_CHANGE);
-        }, window);
+    }
+
+    _rePosBySizeAfterStop(size, isLeft) {
+        const percent = (size * 100) / this._getGrayTrackLength();
+        const significantPercent = parseFloat(percent.toFixed(1));
+        isLeft
+            ? this._setSliderOnePosition(significantPercent)
+            : this._setSliderTwoPosition(significantPercent);
+    }
+
+    _draggable(widget, isLeft) {
+        let startDrag = false;
+        let size = 0,
+            offset = 0,
+            defaultSize = 0;
+        const mouseMoveTracker = new MouseMoveTracker(
+            (deltaX => {
+                if (mouseMoveTracker.isDragging()) {
+                    startDrag = true;
+                    offset += deltaX;
+                    size = optimizeSize(defaultSize + offset);
+                    widget.element.addClass("dragging");
+                    this._rePosBySizeAfterMove(size, isLeft);
+                }
+            }),
+            (() => {
+                if (startDrag === true) {
+                    size = optimizeSize(size);
+                    this._rePosBySizeAfterStop(size, isLeft);
+                    size = 0;
+                    offset = 0;
+                    defaultSize = size;
+                    startDrag = false;
+                }
+                widget.element.removeClass("dragging");
+                mouseMoveTracker.releaseMouseMoves();
+                this.fireEvent(IntervalSlider.EVENT_CHANGE);
+            }),
+            window
+        );
         widget.element.on("mousedown", function (event) {
-            if(!widget.isEnabled()) {
+            if (!widget.isEnabled()) {
                 return;
             }
             defaultSize = this.offsetLeft;
@@ -211,42 +265,47 @@ BI.IntervalSlider = BI.inherit(BI.Single, {
             mouseMoveTracker.captureMouseMoves(event);
         });
 
-        function optimizeSize (s) {
-            return BI.clamp(s, 0, self._getGrayTrackLength());
-        }
-    },
+        const optimizeSize = s => clamp(s, 0, this._getGrayTrackLength());
+    }
 
-    _createLabelWrapper: function () {
-        var c = this._constant;
+    _createLabelWrapper() {
+        const c = this._constant;
+        
         return {
             el: {
-                type: "bi.vertical",
-                items: [{
-                    type: "bi.absolute",
-                    items: [{
-                        el: this.labelOne,
-                        top: 0,
-                        left: 0,
-                    }]
-                }, {
-                    type: "bi.absolute",
-                    items: [{
-                        el: this.labelTwo,
-                        top: 0,
-                        right: 0,
-                    }]
-                }],
+                type: VerticalLayout.xtype,
+                items: [
+                    {
+                        type: AbsoluteLayout.xtype,
+                        items: [
+                            {
+                                el: this.labelOne,
+                                top: 0,
+                                left: 0,
+                            }
+                        ],
+                    },
+                    {
+                        type: AbsoluteLayout.xtype,
+                        items: [
+                            {
+                                el: this.labelTwo,
+                                top: 0,
+                                right: 0,
+                            }
+                        ],
+                    }
+                ],
                 rgap: c.EDITOR_R_GAP,
-                height: c.SLIDER_HEIGHT
+                height: c.SLIDER_HEIGHT,
             },
             top: 0,
             left: 0,
-            width: "100%"
+            width: "100%",
         };
-    },
+    }
 
-    _createSliderWrapper: function () {
-        var c = this._constant;
+    _createSliderWrapper() {
         return {
             el: {
                 type: "bi.horizontal",
@@ -254,7 +313,7 @@ BI.IntervalSlider = BI.inherit(BI.Single, {
                 verticalAlign: "middle",
                 items: [
                     {
-                        type: "bi.absolute",
+                        type: AbsoluteLayout.xtype,
                         height: 12,
                         width: "fill",
                         items: [
@@ -262,24 +321,25 @@ BI.IntervalSlider = BI.inherit(BI.Single, {
                                 el: this.sliderOne,
                                 top: 0,
                                 bottom: 0,
-                                left: 0
-                            }, {
+                                left: 0,
+                            },
+                            {
                                 el: this.sliderTwo,
                                 top: 0,
                                 bottom: 0,
-                                left: "100%"
+                                left: "100%",
                             }
                         ],
                     }
                 ],
                 hgap: 10,
             },
-            inset: 0
+            inset: 0,
         };
-    },
+    }
 
-    _createTrackWrapper: function () {
-        return BI.createWidget({
+    _createTrackWrapper() {
+        return createWidget({
             type: "bi.horizontal",
             cls: "track-wrapper",
             horizontalAlign: "stretch",
@@ -288,100 +348,110 @@ BI.IntervalSlider = BI.inherit(BI.Single, {
             scrollx: false,
             items: [
                 {
-                    type: "bi.absolute",
+                    type: AbsoluteLayout.xtype,
                     height: 6,
-                    items: [{
-                        el: this.grayTrack,
-                        top: 0,
-                        left: 0,
-                        bottom: 0,
-                        width: "100%"
-                    }, {
-                        el: this.blueTrack,
-                        top: 0,
-                        left: 0,
-                        bottom: 0,
-                        width: "0%"
-                    }]
+                    items: [
+                        {
+                            el: this.grayTrack,
+                            top: 0,
+                            left: 0,
+                            bottom: 0,
+                            width: "100%",
+                        },
+                        {
+                            el: this.blueTrack,
+                            top: 0,
+                            left: 0,
+                            bottom: 0,
+                            width: "0%",
+                        }
+                    ],
                 }
             ],
         });
-    },
+    }
 
-    _checkValidation: function (v) {
-        var o = this.options;
-        var valid = false;
+    _checkValidation(v) {
+        const o = this.options;
+        let valid = false;
         // 像90.这样的既不属于整数又不属于小数，是不合法的值
-        var dotText = (v + "").split(".")[1];
-        if (BI.isEmptyString(dotText)) {
-        }else{
-            if (BI.isNumeric(v) && !(BI.isNull(v) || v < this.min || v > this.max)) {
+        let dotText = (`${v}`).split(".")[1];
+        // eslint-disable-next-line no-empty
+        if (isEmptyString(dotText)) {
+        } else {
+            if (isNumeric(v) && !(isNull(v) || v < this.min || v > this.max)) {
                 // 虽然规定了所填写的小数位数，但是我们认为所有的整数都是满足设置的小数位数的
                 // 100等价于100.0 100.00 100.000
-                if(o.digit === false || BI.isInteger(v)) {
+                if (o.digit === false || isInteger(v)) {
                     valid = true;
-                }else{
+                } else {
                     dotText = dotText || "";
-                    valid = (dotText.length === o.digit);
+                    valid = dotText.length === o.digit;
                 }
             }
         }
+        
         return valid;
-    },
+    }
 
-    _checkOverlap: function () {
-        var labelOneLeft = this.labelOne.element[0].offsetLeft;
-        var labelTwoLeft = this.labelTwo.element[0].offsetLeft;
+    _checkOverlap() {
+        const labelOneLeft = this.labelOne.element[0].offsetLeft;
+        const labelTwoLeft = this.labelTwo.element[0].offsetLeft;
         if (labelOneLeft <= labelTwoLeft) {
-            if ((labelTwoLeft - labelOneLeft) < 90) {
-                this.labelTwo.element.css({top: 40});
+            if (labelTwoLeft - labelOneLeft < 90) {
+                this.labelTwo.element.css({ top: 40 });
             } else {
-                this.labelTwo.element.css({top: 0});
+                this.labelTwo.element.css({ top: 0 });
             }
         } else {
-            if ((labelOneLeft - labelTwoLeft) < 90) {
-                this.labelTwo.element.css({top: 40});
+            if (labelOneLeft - labelTwoLeft < 90) {
+                this.labelTwo.element.css({ top: 40 });
             } else {
-                this.labelTwo.element.css({top: 0});
+                this.labelTwo.element.css({ top: 0 });
             }
         }
-    },
-
-    _checkLabelPosition: function (oldValueOne, oldValueTwo, valueOne, valueTwo, isLeft) {
-        oldValueOne = BI.parseFloat(oldValueOne);
-        oldValueTwo = BI.parseFloat(oldValueTwo);
-        valueOne = BI.parseFloat(valueOne);
-        valueTwo = BI.parseFloat(valueTwo);
-        if((oldValueOne <= oldValueTwo && valueOne > valueTwo) || (oldValueOne >= oldValueTwo && valueOne < valueTwo)) {
-            var isSliderOneLeft = BI.parseFloat(this.labelOne.getValue()) < BI.parseFloat(this.labelTwo.getValue());
+    }
+
+    _checkLabelPosition(oldValueOne, oldValueTwo, valueOne, valueTwo, isLeft) {
+        oldValueOne = parseFloat(oldValueOne);
+        oldValueTwo = parseFloat(oldValueTwo);
+        valueOne = parseFloat(valueOne);
+        valueTwo = parseFloat(valueTwo);
+        if (
+            (oldValueOne <= oldValueTwo && valueOne > valueTwo) ||
+            (oldValueOne >= oldValueTwo && valueOne < valueTwo)
+        ) {
+            const isSliderOneLeft =
+                parseFloat(this.labelOne.getValue()) <
+                parseFloat(this.labelTwo.getValue());
             this._resetLabelPosition(!isSliderOneLeft);
         }
-    },
+    }
 
-    _resetLabelPosition: function(needReverse) {
-        this.labelOne.element.css({left: needReverse ? "100%" : "0%"});
-        this.labelTwo.element.css({left: needReverse ? "0%" : "100%"});
-    },
+    _resetLabelPosition(needReverse) {
+        this.labelOne.element.css({ left: needReverse ? "100%" : "0%" });
+        this.labelTwo.element.css({ left: needReverse ? "0%" : "100%" });
+    }
 
-    _setSliderOnePosition: function (percent) {
-        this.sliderOne.element.css({left: percent + "%"});
-    },
+    _setSliderOnePosition(percent) {
+        this.sliderOne.element.css({ left: `${percent}%` });
+    }
 
-    _setSliderTwoPosition: function (percent) {
-        this.sliderTwo.element.css({left: percent + "%"});
-    },
+    _setSliderTwoPosition(percent) {
+        this.sliderTwo.element.css({ left: `${percent}%` });
+    }
 
-    _setBlueTrackLeft: function (percent) {
-        this.blueTrack.element.css({left: percent + "%"});
-    },
+    _setBlueTrackLeft(percent) {
+        this.blueTrack.element.css({ left: `${percent}%` });
+    }
 
-    _setBlueTrackWidth: function (percent) {
-        this.blueTrack.element.css({width: percent + "%"});
-    },
+    _setBlueTrackWidth(percent) {
+        this.blueTrack.element.css({ width: `${percent}%` });
+    }
 
-    _setBlueTrack: function () {
-        var percentOne = this._getPercentByValue(this.labelOne.getValue());
-        var percentTwo = this._getPercentByValue(this.labelTwo.getValue());
+    _setBlueTrack() {
+        const percentOne = this._getPercentByValue(this.labelOne.getValue());
+        const percentTwo = this._getPercentByValue(this.labelTwo.getValue());
         if (percentOne <= percentTwo) {
             this._setBlueTrackLeft(percentOne);
             this._setBlueTrackWidth(percentTwo - percentOne);
@@ -389,133 +459,165 @@ BI.IntervalSlider = BI.inherit(BI.Single, {
             this._setBlueTrackLeft(percentTwo);
             this._setBlueTrackWidth(percentOne - percentTwo);
         }
-    },
+    }
 
-    _setAllPosition: function (one, two) {
+    _setAllPosition(one, two) {
         this._setSliderOnePosition(one);
         this._setSliderTwoPosition(two);
         this._setBlueTrack();
-    },
+    }
 
-    _setVisible: function (visible) {
+    _setVisible(visible) {
         this.sliderOne.setVisible(visible);
         this.sliderTwo.setVisible(visible);
         this.labelOne.setVisible(visible);
         this.labelTwo.setVisible(visible);
-    },
+    }
 
-    _setErrorText: function () {
-        var errorText = BI.i18nText("BI-Basic_Please_Enter_Number_Between", this.min, this.max);
+    _setErrorText() {
+        const errorText = i18nText(
+            "BI-Basic_Please_Enter_Number_Between",
+            this.min,
+            this.max
+        );
         this.labelOne.setErrorText(errorText);
         this.labelTwo.setErrorText(errorText);
-    },
+    }
 
-    _getGrayTrackLength: function () {
+    _getGrayTrackLength() {
         return this.grayTrack.element[0].scrollWidth;
-    },
+    }
 
-    // 其中取max-min后保留4为有效数字后的值的小数位数为最终value的精度
-    // 端点处的值有可能因为min,max相差量级很大(precision很大)而丢失精度，此时直接返回端点值即可
-    _getValueByPercent: function (percent) {// return (((max-min)*percent)/100+min)
+    _getValueByPercent(percent) {
+        // return (((max-min)*percent)/100+min)
         if (percent === 0) {
             return this.min;
         }
         if (percent === 100) {
             return this.max;
         }
-        var sub = this.calculation.accurateSubtraction(this.max, this.min);
-        var mul = this.calculation.accurateMultiplication(sub, percent);
-        var div = this.calculation.accurateDivisionTenExponent(mul, 2);
-        if(this.precision < 0) {
-            var value = BI.parseFloat(this.calculation.accurateAddition(div, this.min));
-            var reduceValue = Math.round(this.calculation.accurateDivisionTenExponent(value, -this.precision));
-            return this.calculation.accurateMultiplication(reduceValue, Math.pow(10, -this.precision));
+        const sub = this.calculation.accurateSubtraction(this.max, this.min);
+        const mul = this.calculation.accurateMultiplication(sub, percent);
+        const div = this.calculation.accurateDivisionTenExponent(mul, 2);
+        if (this.precision < 0) {
+            const value = parseFloat(
+                this.calculation.accurateAddition(div, this.min)
+            );
+            const reduceValue = Math.round(
+                this.calculation.accurateDivisionTenExponent(
+                    value,
+                    -this.precision
+                )
+            );
+            
+            return this.calculation.accurateMultiplication(
+                reduceValue,
+                Math.pow(10, -this.precision)
+            );
         }
-        return BI.parseFloat(this.calculation.accurateAddition(div, this.min).toFixed(this.precision));
-
-    },
+        
+        return parseFloat(
+            this.calculation
+                .accurateAddition(div, this.min)
+                .toFixed(this.precision)
+        );
+    }
 
-    _getPercentByValue: function (v) {
-        return (v - this.min) * 100 / (this.max - this.min);
-    },
+    _getPercentByValue(v) {
+        return ((v - this.min) * 100) / (this.max - this.min);
+    }
 
-    _getPrecision: function () {
+    _getPrecision() {
         // 计算每一份值的精度(最大值和最小值的差值保留4为有效数字后的精度)
         // 如果差值的整数位数大于4,toPrecision(4)得到的是科学计数法123456 => 1.235e+5
         // 返回非负值: 保留的小数位数
         // 返回负值: 保留的10^n精度中的n
-        var sub = this.calculation.accurateSubtraction(this.max, this.min);
-        var pre = sub.toPrecision(4);
+        const sub = this.calculation.accurateSubtraction(this.max, this.min);
+        const pre = sub.toPrecision(4);
         // 科学计数法
-        var eIndex = pre.indexOf("e");
-        var arr = [];
-        if(eIndex > -1) {
+        const eIndex = pre.indexOf("e");
+        let arr = [];
+        if (eIndex > -1) {
             arr = pre.split("e");
-            var decimalPartLength = BI.size(arr[0].split(".")[1]);
-            var sciencePartLength = BI.parseInt(arr[1].substring(1));
+            const decimalPartLength = size(arr[0].split(".")[1]);
+            const sciencePartLength = parseInt(arr[1].substring(1));
+            
             return decimalPartLength - sciencePartLength;
         }
         arr = pre.split(".");
+        
         return arr.length > 1 ? arr[1].length : 0;
+    }
 
-    },
-
-    _assertValue: function (value) {
-        if(value <= this.min) {
+    _assertValue(value) {
+        if (value <= this.min) {
             return this.min;
         }
-        if(value >= this.max) {
+        if (value >= this.max) {
             return this.max;
         }
+        
         return value;
-    },
+    }
 
-    _setEnable: function (b) {
-        BI.IntervalSlider.superclass._setEnable.apply(this, [b]);
-        if(b) {
-            this.blueTrack.element.removeClass("disabled-blue-track").addClass("blue-track");
+    _setEnable(b) {
+        super._setEnable.apply(this, [b]);
+        if (b) {
+            this.blueTrack.element
+                .removeClass("disabled-blue-track")
+                .addClass("blue-track");
         } else {
-            this.blueTrack.element.removeClass("blue-track").addClass("disabled-blue-track");
+            this.blueTrack.element
+                .removeClass("blue-track")
+                .addClass("disabled-blue-track");
         }
-    },
+    }
 
-    getValue: function () {
+    getValue() {
         if (this.valueOne <= this.valueTwo) {
-            return {min: this.valueOne, max: this.valueTwo};
+            return { min: this.valueOne, max: this.valueTwo };
         }
-        return {min: this.valueTwo, max: this.valueOne};
-
-    },
+        
+        return { min: this.valueTwo, max: this.valueOne };
+    }
 
-    _setMinAndMax: function (v) {
-        var minNumber = BI.parseFloat(v.min);
-        var maxNumber = BI.parseFloat(v.max);
-        if ((!isNaN(minNumber)) && (!isNaN(maxNumber)) && (maxNumber >= minNumber)) {
+    _setMinAndMax(v) {
+        const minNumber = parseFloat(v.min);
+        const maxNumber = parseFloat(v.max);
+        if (!isNaN(minNumber) && !isNaN(maxNumber) && maxNumber >= minNumber) {
             this.min = minNumber;
             this.max = maxNumber;
             this.valueOne = minNumber;
             this.valueTwo = maxNumber;
             this.precision = this._getPrecision();
         }
-    },
+    }
 
-    setMinAndMax: function (v) {
+    setMinAndMax(v) {
         this._setMinAndMax(v);
         this.setEnable(v.min <= v.max);
-    },
-
-    setValue: function (v) {
-        var o = this.options;
-        var valueOne = BI.parseFloat(v.min);
-        var valueTwo = BI.parseFloat(v.max);
-        valueOne = o.digit === false ? valueOne : BI.parseFloat(valueOne.toFixed(o.digit));
-        valueTwo = o.digit === false ? valueTwo : BI.parseFloat(valueTwo.toFixed(o.digit));
+    }
+
+    setValue(v) {
+        const o = this.options;
+        let valueOne = parseFloat(v.min);
+        let valueTwo = parseFloat(v.max);
+        valueOne =
+            o.digit === false
+                ? valueOne
+                : parseFloat(valueOne.toFixed(o.digit));
+        valueTwo =
+            o.digit === false
+                ? valueTwo
+                : parseFloat(valueTwo.toFixed(o.digit));
         if (!isNaN(valueOne) && !isNaN(valueTwo)) {
             if (this._checkValidation(valueOne)) {
-                this.valueOne = (this.valueOne <= this.valueTwo ? valueOne : valueTwo);
+                this.valueOne =
+                    this.valueOne <= this.valueTwo ? valueOne : valueTwo;
             }
             if (this._checkValidation(valueTwo)) {
-                this.valueTwo = (this.valueOne <= this.valueTwo ? valueTwo : valueOne);
+                this.valueTwo =
+                    this.valueOne <= this.valueTwo ? valueTwo : valueOne;
             }
             if (valueOne < this.min) {
                 this.valueOne = this.min;
@@ -524,9 +626,9 @@ BI.IntervalSlider = BI.inherit(BI.Single, {
                 this.valueTwo = this.max;
             }
         }
-    },
+    }
 
-    reset: function () {
+    reset() {
         this._setVisible(false);
         this.enable = false;
         this.valueOne = "";
@@ -534,18 +636,32 @@ BI.IntervalSlider = BI.inherit(BI.Single, {
         this.min = NaN;
         this.max = NaN;
         this._setBlueTrackWidth(0);
-    },
+    }
 
-    populate: function () {
-        var o = this.options;
+    populate() {
+        const o = this.options;
         if (!isNaN(this.min) && !isNaN(this.max)) {
             this.enable = true;
             this._setVisible(true);
             this._setErrorText();
-            if ((BI.isNumeric(this.valueOne) || BI.isNotEmptyString(this.valueOne)) && (BI.isNumeric(this.valueTwo) || BI.isNotEmptyString(this.valueTwo))) {
-                this.labelOne.setValue(o.digit === false ? this.valueOne : BI.parseFloat(this.valueOne).toFixed(o.digit));
-                this.labelTwo.setValue(o.digit === false ? this.valueTwo : BI.parseFloat(this.valueTwo).toFixed(o.digit));
-                this._setAllPosition(this._getPercentByValue(this.valueOne), this._getPercentByValue(this.valueTwo));
+            if (
+                (isNumeric(this.valueOne) || isNotEmptyString(this.valueOne)) &&
+                (isNumeric(this.valueTwo) || isNotEmptyString(this.valueTwo))
+            ) {
+                this.labelOne.setValue(
+                    o.digit === false
+                        ? this.valueOne
+                        : parseFloat(this.valueOne).toFixed(o.digit)
+                );
+                this.labelTwo.setValue(
+                    o.digit === false
+                        ? this.valueTwo
+                        : parseFloat(this.valueTwo).toFixed(o.digit)
+                );
+                this._setAllPosition(
+                    this._getPercentByValue(this.valueOne),
+                    this._getPercentByValue(this.valueTwo)
+                );
             } else {
                 this.labelOne.setValue(this.min);
                 this.labelTwo.setValue(this.max);
@@ -554,6 +670,4 @@ BI.IntervalSlider = BI.inherit(BI.Single, {
             this._resetLabelPosition(this.valueOne > this.valueTwo);
         }
     }
-});
-BI.IntervalSlider.EVENT_CHANGE = "EVENT_CHANGE";
-BI.shortcut("bi.interval_slider", BI.IntervalSlider);
+}
diff --git a/src/widget/intervalslider/model.accuratecalculation.js b/src/widget/intervalslider/model.accuratecalculation.js
index aa430dad1..fcc944e78 100644
--- a/src/widget/intervalslider/model.accuratecalculation.js
+++ b/src/widget/intervalslider/model.accuratecalculation.js
@@ -1,172 +1,239 @@
-/**
- * Created by zcf on 2017/3/1.
- * 万恶的IEEE-754
- * 使用字符串精确计算含小数加法、减法、乘法和10的指数倍除法，支持负数
- */
-BI.AccurateCalculationModel = BI.inherit(BI.Widget, {
-    _defaultConfig: function () {
-        return BI.extend(BI.AccurateCalculationModel.superclass._defaultConfig.apply(this, arguments), {
-            baseCls: ""
+import { Widget, extend, parseInt, parseFloat } from "@/core";
+
+export class AccurateCalculationModel extends Widget {
+    _defaultConfig() {
+        return extend(super._defaultConfig(...arguments), {
+            baseCls: "",
         });
-    },
+    }
 
-    _init: function () {
-        BI.AccurateCalculationModel.superclass._init.apply(this, arguments);
-    },
+    _init() {
+        super._init(...arguments);
+    }
 
-    _getMagnitude: function (n) {
-        var magnitude = "1";
-        for (var i = 0; i < n; i++) {
+    _getMagnitude(n) {
+        let magnitude = "1";
+        for (let i = 0; i < n; i++) {
             magnitude += "0";
         }
-        return BI.parseInt(magnitude);
-    },
+        
+        return parseInt(magnitude);
+    }
 
-    _formatDecimal: function (stringNumber1, stringNumber2) {
+    _formatDecimal(stringNumber1, stringNumber2) {
         if (stringNumber1.numDecimalLength === stringNumber2.numDecimalLength) {
             return;
         }
-        var magnitudeDiff = stringNumber1.numDecimalLength - stringNumber2.numDecimalLength;
+        let magnitudeDiff =
+            stringNumber1.numDecimalLength - stringNumber2.numDecimalLength;
+        let needAddZero;
         if (magnitudeDiff > 0) {
-            var needAddZero = stringNumber2;
+            needAddZero = stringNumber2;
         } else {
-            var needAddZero = stringNumber1;
-            magnitudeDiff = (0 - magnitudeDiff);
+            needAddZero = stringNumber1;
+            magnitudeDiff = 0 - magnitudeDiff;
         }
-        for (var i = 0; i < magnitudeDiff; i++) {
+        for (let i = 0; i < magnitudeDiff; i++) {
             if (needAddZero.numDecimal === "0" && i === 0) {
                 continue;
             }
             needAddZero.numDecimal += "0";
         }
-    },
+    }
 
-    _stringNumberFactory: function (num) {
-        var strNum = num.toString();
-        var numStrArray = strNum.split(".");
-        var numInteger = numStrArray[0];
+    _stringNumberFactory(num) {
+        const strNum = num.toString();
+        const numStrArray = strNum.split(".");
+        const numInteger = numStrArray[0];
+        let numDecimal;
+        let numDecimalLength;
         if (numStrArray.length === 1) {
-            var numDecimal = "0";
-            var numDecimalLength = 0;
+            numDecimal = "0";
+            numDecimalLength = 0;
         } else {
-            var numDecimal = numStrArray[1];
-            var numDecimalLength = numStrArray[1].length;
+            numDecimal = numStrArray[1];
+            numDecimalLength = numStrArray[1].length;
         }
+        
         return {
-            numInteger: numInteger,
-            numDecimal: numDecimal,
-            numDecimalLength: numDecimalLength
+            numInteger,
+            numDecimal,
+            numDecimalLength,
         };
-    },
+    }
 
-    _accurateSubtraction: function (num1, num2) {// num1-num2 && num1>num2
-        var stringNumber1 = this._stringNumberFactory(num1);
-        var stringNumber2 = this._stringNumberFactory(num2);
+    _accurateSubtraction(num1, num2) {
+        // num1-num2 && num1>num2
+        const stringNumber1 = this._stringNumberFactory(num1);
+        const stringNumber2 = this._stringNumberFactory(num2);
         // 整数部分计算
-        var integerResult = BI.parseInt(stringNumber1.numInteger) - BI.parseInt(stringNumber2.numInteger);
+        let integerResult =
+            parseInt(stringNumber1.numInteger) -
+            parseInt(stringNumber2.numInteger);
         // 小数部分
         this._formatDecimal(stringNumber1, stringNumber2);
-        var decimalMaxLength = getDecimalMaxLength(stringNumber1, stringNumber2);
+        const decimalMaxLength = getDecimalMaxLength(
+            stringNumber1,
+            stringNumber2
+        );
 
-        if (BI.parseInt(stringNumber1.numDecimal) >= BI.parseInt(stringNumber2.numDecimal)) {
-            var decimalResultTemp = (BI.parseInt(stringNumber1.numDecimal) - BI.parseInt(stringNumber2.numDecimal)).toString();
-            var decimalResult = addZero(decimalResultTemp, decimalMaxLength);
-        } else {// 否则借位
+        let decimalResultTemp;
+        let decimalResult;
+
+        if (
+            parseInt(stringNumber1.numDecimal) >=
+            parseInt(stringNumber2.numDecimal)
+        ) {
+            decimalResultTemp = (
+                parseInt(stringNumber1.numDecimal) -
+                parseInt(stringNumber2.numDecimal)
+            ).toString();
+            decimalResult = addZero(decimalResultTemp, decimalMaxLength);
+        } else {
+            // 否则借位
             integerResult--;
-            var borrow = this._getMagnitude(decimalMaxLength);
-            var decimalResultTemp = (borrow + BI.parseInt(stringNumber1.numDecimal) - BI.parseInt(stringNumber2.numDecimal)).toString();
-            var decimalResult = addZero(decimalResultTemp, decimalMaxLength);
+            const borrow = this._getMagnitude(decimalMaxLength);
+            decimalResultTemp = (
+                borrow +
+                parseInt(stringNumber1.numDecimal) -
+                parseInt(stringNumber2.numDecimal)
+            ).toString();
+            decimalResult = addZero(decimalResultTemp, decimalMaxLength);
         }
-        var result = integerResult + "." + decimalResult;
-        return BI.parseFloat(result);
+        const result = `${integerResult}.${decimalResult}`;
+        
+        return parseFloat(result);
 
-        function getDecimalMaxLength (num1, num2) {
+        function getDecimalMaxLength(num1, num2) {
             if (num1.numDecimal.length >= num2.numDecimal.length) {
                 return num1.numDecimal.length;
             }
+            
             return num2.numDecimal.length;
         }
 
-        function addZero (resultTemp, length) {
-            var diff = length - resultTemp.length;
-            for (var i = 0; i < diff; i++) {
-                resultTemp = "0" + resultTemp;
+        function addZero(resultTemp, length) {
+            const diff = length - resultTemp.length;
+            for (let i = 0; i < diff; i++) {
+                resultTemp = `0${resultTemp}`;
             }
+            
             return resultTemp;
         }
-    },
+    }
 
-    _accurateAddition: function (num1, num2) {// 加法结合律
-        var stringNumber1 = this._stringNumberFactory(num1);
-        var stringNumber2 = this._stringNumberFactory(num2);
+    _accurateAddition(num1, num2) {
+        // 加法结合律
+        const stringNumber1 = this._stringNumberFactory(num1);
+        const stringNumber2 = this._stringNumberFactory(num2);
         // 整数部分计算
-        var integerResult = BI.parseInt(stringNumber1.numInteger) + BI.parseInt(stringNumber2.numInteger);
+        let integerResult =
+            parseInt(stringNumber1.numInteger) +
+            parseInt(stringNumber2.numInteger);
         // 小数部分
         this._formatDecimal(stringNumber1, stringNumber2);
 
-        var decimalResult = (BI.parseInt(stringNumber1.numDecimal) + BI.parseInt(stringNumber2.numDecimal)).toString();
+        let decimalResult = (
+            parseInt(stringNumber1.numDecimal) +
+            parseInt(stringNumber2.numDecimal)
+        ).toString();
 
         if (decimalResult !== "0") {
             if (decimalResult.length <= stringNumber1.numDecimal.length) {
-                decimalResult = addZero(decimalResult, stringNumber1.numDecimal.length);
+                decimalResult = addZero(
+                    decimalResult,
+                    stringNumber1.numDecimal.length
+                );
             } else {
-                integerResult++;// 进一
+                integerResult++; // 进一
                 decimalResult = decimalResult.slice(1);
             }
         }
-        var result = integerResult + "." + decimalResult;
-        return BI.parseFloat(result);
+        const result = `${integerResult}.${decimalResult}`;
+        
+        return parseFloat(result);
 
-        function addZero (resultTemp, length) {
-            var diff = length - resultTemp.length;
-            for (var i = 0; i < diff; i++) {
-                resultTemp = "0" + resultTemp;
+        function addZero(resultTemp, length) {
+            const diff = length - resultTemp.length;
+            for (let i = 0; i < diff; i++) {
+                resultTemp = `0${resultTemp}`;
             }
+            
             return resultTemp;
         }
-    },
+    }
 
-    _accurateMultiplication: function (num1, num2) {// 乘法分配律
-        var stringNumber1 = this._stringNumberFactory(num1);
-        var stringNumber2 = this._stringNumberFactory(num2);
+    _accurateMultiplication(num1, num2) {
+        // 乘法分配律
+        const stringNumber1 = this._stringNumberFactory(num1);
+        const stringNumber2 = this._stringNumberFactory(num2);
         // 整数部分计算
-        var integerResult = BI.parseInt(stringNumber1.numInteger) * BI.parseInt(stringNumber2.numInteger);
+        const integerResult =
+            parseInt(stringNumber1.numInteger) *
+            parseInt(stringNumber2.numInteger);
         // num1的小数和num2的整数
-        var dec1Int2 = this._accurateDivisionTenExponent(BI.parseInt(stringNumber1.numDecimal) * BI.parseInt(stringNumber2.numInteger), stringNumber1.numDecimalLength);
+        const dec1Int2 = this._accurateDivisionTenExponent(
+            parseInt(stringNumber1.numDecimal) *
+                parseInt(stringNumber2.numInteger),
+            stringNumber1.numDecimalLength
+        );
         // num1的整数和num2的小数
-        var int1dec2 = this._accurateDivisionTenExponent(BI.parseInt(stringNumber1.numInteger) * BI.parseInt(stringNumber2.numDecimal), stringNumber2.numDecimalLength);
+        const int1dec2 = this._accurateDivisionTenExponent(
+            parseInt(stringNumber1.numInteger) *
+                parseInt(stringNumber2.numDecimal),
+            stringNumber2.numDecimalLength
+        );
         // 小数*小数
-        var dec1dec2 = this._accurateDivisionTenExponent(BI.parseInt(stringNumber1.numDecimal) * BI.parseInt(stringNumber2.numDecimal), (stringNumber1.numDecimalLength + stringNumber2.numDecimalLength));
+        const dec1dec2 = this._accurateDivisionTenExponent(
+            parseInt(stringNumber1.numDecimal) *
+                parseInt(stringNumber2.numDecimal),
+            stringNumber1.numDecimalLength + stringNumber2.numDecimalLength
+        );
 
-        return this._accurateAddition(this._accurateAddition(this._accurateAddition(integerResult, dec1Int2), int1dec2), dec1dec2);
-    },
+        return this._accurateAddition(
+            this._accurateAddition(
+                this._accurateAddition(integerResult, dec1Int2),
+                int1dec2
+            ),
+            dec1dec2
+        );
+    }
 
-    _accurateDivisionTenExponent: function (num, n) {// num/10^n && n>0
-        var stringNumber = this._stringNumberFactory(num);
+    _accurateDivisionTenExponent(num, n) {
+        // num/10^n && n>0
+        const stringNumber = this._stringNumberFactory(num);
+        let integerResult, partDecimalResult;
         if (stringNumber.numInteger.length > n) {
-            var integerResult = stringNumber.numInteger.slice(0, (stringNumber.numInteger.length - n));
-            var partDecimalResult = stringNumber.numInteger.slice(-n);
+            integerResult = stringNumber.numInteger.slice(
+                0,
+                stringNumber.numInteger.length - n
+            );
+            partDecimalResult = stringNumber.numInteger.slice(-n);
         } else {
-            var integerResult = "0";
-            var partDecimalResult = addZero(stringNumber.numInteger, n);
+            integerResult = "0";
+            partDecimalResult = addZero(stringNumber.numInteger, n);
         }
-        var result = integerResult + "." + partDecimalResult + stringNumber.numDecimal;
-        return BI.parseFloat(result);
+        const result =
+            `${integerResult}.${partDecimalResult}${stringNumber.numDecimal}`;
+        
+        return parseFloat(result);
 
-        function addZero (resultTemp, length) {
-            var diff = length - resultTemp.length;
-            for (var i = 0; i < diff; i++) {
-                resultTemp = "0" + resultTemp;
+        function addZero(resultTemp, length) {
+            const diff = length - resultTemp.length;
+            for (let i = 0; i < diff; i++) {
+                resultTemp = `0${resultTemp}`;
             }
+            
             return resultTemp;
         }
-    },
+    }
 
-    accurateSubtraction: function (num1, num2) {
+    accurateSubtraction(num1, num2) {
         if (num1 >= 0 && num2 >= 0) {
             if (num1 >= num2) {
                 return this._accurateSubtraction(num1, num2);
             }
+            
             return -this._accurateSubtraction(num2, num1);
         }
         if (num1 >= 0 && num2 < 0) {
@@ -179,11 +246,12 @@ BI.AccurateCalculationModel = BI.inherit(BI.Widget, {
             if (num1 >= num2) {
                 return this._accurateSubtraction(-num2, -num1);
             }
+            
             return this._accurateSubtraction(-num1, -num2);
         }
-    },
+    }
 
-    accurateAddition: function (num1, num2) {
+    accurateAddition(num1, num2) {
         if (num1 >= 0 && num2 >= 0) {
             return this._accurateAddition(num1, num2);
         }
@@ -196,9 +264,9 @@ BI.AccurateCalculationModel = BI.inherit(BI.Widget, {
         if (num1 < 0 && num2 < 0) {
             return -this._accurateAddition(-num1, -num2);
         }
-    },
+    }
 
-    accurateMultiplication: function (num1, num2) {
+    accurateMultiplication(num1, num2) {
         if (num1 >= 0 && num2 >= 0) {
             return this._accurateMultiplication(num1, num2);
         }
@@ -211,12 +279,13 @@ BI.AccurateCalculationModel = BI.inherit(BI.Widget, {
         if (num1 < 0 && num2 < 0) {
             return this._accurateMultiplication(-num1, -num2);
         }
-    },
+    }
 
-    accurateDivisionTenExponent: function (num1, n) {
+    accurateDivisionTenExponent(num1, n) {
         if (num1 >= 0) {
             return this._accurateDivisionTenExponent(num1, n);
         }
+        
         return -this._accurateDivisionTenExponent(-num1, n);
     }
-});
\ No newline at end of file
+}
diff --git a/src/widget/singleslider/button/editor.sign.text.js b/src/widget/singleslider/button/editor.sign.text.js
index 281c7b0e1..09eb164db 100644
--- a/src/widget/singleslider/button/editor.sign.text.js
+++ b/src/widget/singleslider/button/editor.sign.text.js
@@ -1,196 +1,217 @@
-BI.SignTextEditor = BI.inherit(BI.Widget, {
-    _defaultConfig: function () {
-        var conf = BI.SignTextEditor.superclass._defaultConfig.apply(this, arguments);
-        return BI.extend(conf, {
-            baseCls: (conf.baseCls || "") + " bi-sign-initial-editor",
-            validationChecker: BI.emptyFn,
+import {
+    shortcut,
+    Widget,
+    extend,
+    emptyFn,
+    createWidget,
+    nextTick,
+    Controller,
+    AbsoluteLayout,
+    VerticalLayout,
+    bind,
+    isEmpty,
+    isKey
+} from "@/core";
+import { TextButton, Editor } from "@/base";
+
+@shortcut()
+export class SignTextEditor extends Widget {
+    static xtype = "bi.sign_text_editor";
+
+    static EVENT_CONFIRM = "EVENT_CONFIRM";
+    static EVENT_CHANGE_CONFIRM = "EVENT_CHANGE_CONFIRM";
+    static EVENT_CLICK_LABEL = "EVENT_CLICK_LABEL";
+
+    _defaultConfig() {
+        const conf = super._defaultConfig(...arguments);
+        
+        return extend(conf, {
+            baseCls: `${conf.baseCls || ""} bi-sign-initial-editor`,
+            validationChecker: emptyFn,
             text: "",
-            height: 24
+            height: 24,
         });
-    },
+    }
 
-    _init: function () {
-        BI.SignTextEditor.superclass._init.apply(this, arguments);
-        var self = this, o = this.options;
-        this.editor = BI.createWidget({
-            type: "bi.editor",
+    _init() {
+        super._init(...arguments);
+        const o = this.options;
+        this.editor = createWidget({
+            type: Editor.xtype,
             simple: o.simple,
             height: o.height,
             hgap: 4,
             vgap: 2,
             value: o.value,
             validationChecker: o.validationChecker,
-            allowBlank: false
+            allowBlank: false,
         });
-        this.text = BI.createWidget({
-            type: "bi.text_button",
+        this.text = createWidget({
+            type: TextButton.xtype,
             cls: "sign-editor-text",
-            title: function () {
-                return self.getValue();
-            },
+            title: () => this.getValue(),
             textAlign: o.textAlign,
             height: o.height,
             hgap: 4,
-            handler: function () {
-                self._showInput();
-                self.editor.focus();
-                self.editor.selectAll();
-            }
+            handler: () => {
+                this._showInput();
+                this.editor.focus();
+                this.editor.selectAll();
+            },
         });
-        this.text.on(BI.TextButton.EVENT_CHANGE, function () {
-            BI.nextTick(function () {
-                self.fireEvent(BI.SignTextEditor.EVENT_CLICK_LABEL);
+        this.text.on(TextButton.EVENT_CHANGE, () => {
+            nextTick(() => {
+                this.fireEvent(SignTextEditor.EVENT_CLICK_LABEL);
             });
         });
-        BI.createWidget({
-            type: "bi.absolute",
+        createWidget({
+            type: AbsoluteLayout.xtype,
             element: this,
-            items: [{
-                el: this.text,
-                left: 0,
-                right: 0,
-                top: 0,
-                bottom: 0
-            }]
+            items: [
+                {
+                    el: this.text,
+                    left: 0,
+                    right: 0,
+                    top: 0,
+                    bottom: 0,
+                }
+            ],
         });
-        this.editor.on(BI.Controller.EVENT_CHANGE, function () {
-            self.fireEvent(BI.Controller.EVENT_CHANGE, arguments);
+        this.editor.on(Controller.EVENT_CHANGE, (...args) => {
+            this.fireEvent(Controller.EVENT_CHANGE, ...args);
         });
-        this.editor.on(BI.Editor.EVENT_CONFIRM, function () {
-            self._showHint();
-            self._checkText();
-            self.fireEvent(BI.SignTextEditor.EVENT_CONFIRM, arguments);
+        this.editor.on(Editor.EVENT_CONFIRM, (...args) => {
+            this._showHint();
+            this._checkText();
+            this.fireEvent(SignTextEditor.EVENT_CONFIRM, ...args);
         });
-        this.editor.on(BI.Editor.EVENT_CHANGE_CONFIRM, function () {
-            self._showHint();
-            self._checkText();
-            self.fireEvent(BI.SignTextEditor.EVENT_CHANGE_CONFIRM, arguments);
+        this.editor.on(Editor.EVENT_CHANGE_CONFIRM, (...args) => {
+            this._showHint();
+            this._checkText();
+            this.fireEvent(SignTextEditor.EVENT_CHANGE_CONFIRM, ...args);
         });
-        this.editor.on(BI.Editor.EVENT_ERROR, function () {
-            self._checkText();
+        this.editor.on(Editor.EVENT_ERROR, () => {
+            this._checkText();
         });
-        BI.createWidget({
-            type: "bi.vertical",
+        createWidget({
+            type: VerticalLayout.xtype,
             scrolly: false,
             element: this,
-            items: [this.editor]
+            items: [this.editor],
         });
         this._showHint();
-        self._checkText();
-    },
-
-    _checkText: function () {
-        var o = this.options;
-        BI.nextTick(BI.bind(function () {
-            if (this.editor.getValue() === "") {
-                this.text.setValue(o.watermark || "");
-                this.text.element.addClass("bi-water-mark");
-            } else {
-                var v = this.editor.getValue();
-                v = (BI.isEmpty(v) || v == o.text) ? o.text : v + o.text;
-                this.text.setValue(v);
-                this.text.element.removeClass("bi-water-mark");
-            }
-        }, this));
-    },
-
-    _showInput: function () {
+        this._checkText();
+    }
+
+    _checkText() {
+        const o = this.options;
+        nextTick(
+            bind(() => {
+                if (this.editor.getValue() === "") {
+                    this.text.setValue(o.watermark || "");
+                    this.text.element.addClass("bi-water-mark");
+                } else {
+                    let v = this.editor.getValue();
+                    v = isEmpty(v) || v === o.text ? o.text : v + o.text;
+                    this.text.setValue(v);
+                    this.text.element.removeClass("bi-water-mark");
+                }
+            }, this)
+        );
+    }
+
+    _showInput() {
         this.editor.visible();
         this.text.invisible();
-    },
+    }
 
-    _showHint: function () {
+    _showHint() {
         this.editor.invisible();
         this.text.visible();
-    },
+    }
 
-    setTitle: function (title) {
+    setTitle(title) {
         this.text.setTitle(title);
-    },
+    }
 
-    setWarningTitle: function (title) {
+    setWarningTitle(title) {
         this.text.setWarningTitle(title);
-    },
+    }
 
-    focus: function () {
+    focus() {
         this._showInput();
         this.editor.focus();
-    },
+    }
 
-    blur: function () {
+    blur() {
         this.editor.blur();
         this._showHint();
         this._checkText();
-    },
+    }
 
-    doRedMark: function () {
-        if (this.editor.getValue() === "" && BI.isKey(this.options.watermark)) {
+    doRedMark() {
+        if (this.editor.getValue() === "" && isKey(this.options.watermark)) {
             return;
         }
-        this.text.doRedMark.apply(this.text, arguments);
-    },
+        this.text.doRedMark(...arguments);
+    }
 
-    unRedMark: function () {
-        this.text.unRedMark.apply(this.text, arguments);
-    },
+    unRedMark() {
+        this.text.unRedMark(...arguments);
+    }
 
-    doHighLight: function () {
-        if (this.editor.getValue() === "" && BI.isKey(this.options.watermark)) {
+    doHighLight() {
+        if (this.editor.getValue() === "" && isKey(this.options.watermark)) {
             return;
         }
-        this.text.doHighLight.apply(this.text, arguments);
-    },
+        this.text.doHighLight(...arguments);
+    }
 
-    unHighLight: function () {
-        this.text.unHighLight.apply(this.text, arguments);
-    },
+    unHighLight() {
+        this.text.unHighLight(...arguments);
+    }
 
-    isValid: function () {
+    isValid() {
         return this.editor.isValid();
-    },
+    }
 
-    setErrorText: function (text) {
+    setErrorText(text) {
         this.editor.setErrorText(text);
-    },
+    }
 
-    getErrorText: function () {
+    getErrorText() {
         return this.editor.getErrorText();
-    },
+    }
 
-    isEditing: function () {
+    isEditing() {
         return this.editor.isEditing();
-    },
+    }
 
-    getLastValidValue: function () {
+    getLastValidValue() {
         return this.editor.getLastValidValue();
-    },
+    }
 
-    getLastChangedValue: function () {
+    getLastChangedValue() {
         return this.editor.getLastChangedValue();
-    },
+    }
 
-    setValue: function (v) {
+    setValue(v) {
         this.editor.setValue(v);
         this._checkText();
-    },
+    }
 
-    getValue: function () {
+    getValue() {
         return this.editor.getValue();
-    },
+    }
 
-    getState: function () {
+    getState() {
         return this.text.getValue();
-    },
+    }
 
-    setState: function (v) {
-        var o = this.options;
+    setState(v) {
+        const o = this.options;
         this._showHint();
-        v = (BI.isEmpty(v) || v == o.text) ? o.text : v + o.text;
+        v = isEmpty(v) || v === o.text ? o.text : v + o.text;
         this.text.setValue(v);
     }
-});
-BI.SignTextEditor.EVENT_CONFIRM = "EVENT_CONFIRM";
-BI.SignTextEditor.EVENT_CHANGE_CONFIRM = "EVENT_CHANGE_CONFIRM";
-BI.SignTextEditor.EVENT_CLICK_LABEL = "EVENT_CLICK_LABEL";
-
-BI.shortcut("bi.sign_text_editor", BI.SignTextEditor);
\ No newline at end of file
+}
diff --git a/src/widget/singleslider/button/iconbutton.slider.js b/src/widget/singleslider/button/iconbutton.slider.js
index 3b3432253..c1b5ce6f8 100644
--- a/src/widget/singleslider/button/iconbutton.slider.js
+++ b/src/widget/singleslider/button/iconbutton.slider.js
@@ -1,26 +1,24 @@
-/**
- * Created by zcf on 2016/9/22.
- */
-BI.SliderIconButton = BI.inherit(BI.Widget, {
+import { shortcut, Widget, Layout } from "@/core";
 
-    props: {
+@shortcut()
+export class SliderIconButton extends Widget {
+    static xtype = "bi.single_slider_button";
+
+    props = {
         baseCls: "bi-single-slider-button slider-button bi-high-light-border",
         height: 8,
         width: 8,
-    },
-
-    constants: {
+    }
+    constants = {
         LARGE_SIZE: 16,
         NORMAL_SIZE: 12,
         LARGE_OFFSET: 4,
-        NORMAL_OFFSET: 6
-    },
+        NORMAL_OFFSET: 6,
+    };
 
-    render: function () {
-        var self = this;
+    render() {
         return {
-            type: "bi.layout",
+            type: Layout.xtype,
         };
     }
-});
-BI.shortcut("bi.single_slider_button", BI.SliderIconButton);
+}
diff --git a/src/widget/singleslider/index.js b/src/widget/singleslider/index.js
new file mode 100644
index 000000000..dc4943c0c
--- /dev/null
+++ b/src/widget/singleslider/index.js
@@ -0,0 +1,5 @@
+export { SingleSlider } from "./singleslider";
+export { SingleSliderLabel } from "./singleslider.label";
+export { SingleSliderNormal } from "./singleslider.normal";
+export { SignTextEditor } from "./button/editor.sign.text";
+export { SliderIconButton } from "./button/iconbutton.slider";
diff --git a/src/widget/singleslider/singleslider.js b/src/widget/singleslider/singleslider.js
index 8cf77b180..0a2b7496e 100644
--- a/src/widget/singleslider/singleslider.js
+++ b/src/widget/singleslider/singleslider.js
@@ -1,8 +1,29 @@
-/**
- * Created by zcf on 2016/9/22.
- */
-BI.SingleSlider = BI.inherit(BI.Single, {
-    _constant: {
+import {
+    shortcut,
+    createWidget,
+    parseFloat,
+    toPix,
+    Layout,
+    VerticalAdaptLayout,
+    AbsoluteLayout,
+    VerticalLayout,
+    HorizontalAutoLayout,
+    clamp,
+    isNumeric,
+    isNull,
+    parseInt,
+    i18nText,
+    isNotEmptyString,
+    MouseMoveTracker
+} from "@/core";
+import { Single } from "@/base";
+import { SignEditor } from "@/case";
+
+@shortcut()
+export class SingleSlider extends Single {
+    static xtype = "bi.single_slider";
+
+    _constant = {
         EDITOR_WIDTH: 90,
         EDITOR_HEIGHT: 20,
         SLIDER_WIDTH_HALF: 15,
@@ -10,19 +31,21 @@ BI.SingleSlider = BI.inherit(BI.Single, {
         SLIDER_HEIGHT: 30,
         TRACK_HEIGHT: 24,
         TRACK_GAP_HALF: 7,
-        TRACK_GAP: 14
-    },
+        TRACK_GAP: 14,
+    }
 
-    props: {
+    props = {
         baseCls: "bi-single-slider bi-slider-track",
         digit: false,
         unit: "",
         value: "",
         min: 0,
         max: 100,
-    },
+    };
 
-    beforeMount: function () {
+    static EVENT_CHANGE = "EVENT_CHANGE";
+
+    beforeMount() {
         const { value, min, max } = this.options;
         this.setMinAndMax({
             min,
@@ -30,175 +53,205 @@ BI.SingleSlider = BI.inherit(BI.Single, {
         });
         this.setValue(value);
         this.populate();
-    },
+    }
 
-    render: function () {
-        var self = this, o = this.options;
-        var c = this._constant;
+    render() {
+        const o = this.options;
+        const c = this._constant;
         this.enable = false;
         this.value = "";
 
-        this.grayTrack = BI.createWidget({
-            type: "bi.layout",
+        this.grayTrack = createWidget({
+            type: Layout.xtype,
             cls: "gray-track",
-            height: 6
+            height: 6,
         });
-        this.blueTrack = BI.createWidget({
-            type: "bi.layout",
+        this.blueTrack = createWidget({
+            type: Layout.xtype,
             cls: "blue-track bi-high-light-background",
-            height: 6
+            height: 6,
         });
         this.track = this._createTrackWrapper();
 
-        this.slider = BI.createWidget({
-            type: "bi.single_slider_button"
+        this.slider = createWidget({
+            type: "bi.single_slider_button",
         });
         this._draggable(this.slider);
-        var sliderVertical = BI.createWidget({
-            type: "bi.vertical_adapt",
+        const sliderVertical = createWidget({
+            type: VerticalAdaptLayout.xtype,
             cls: "slider-wrapper",
             columnSize: ["fill"],
-            items: [{
-                type: "bi.absolute",
-                items: [
-                    {
-                        el: this.slider,
-                        top: 8,
-                    }
-                ],
-                height: c.SLIDER_HEIGHT
-            }],
+            items: [
+                {
+                    type: AbsoluteLayout.xtype,
+                    items: [
+                        {
+                            el: this.slider,
+                            top: 8,
+                        }
+                    ],
+                    height: c.SLIDER_HEIGHT,
+                }
+            ],
             hgap: c.SLIDER_WIDTH_HALF,
-            height: c.SLIDER_HEIGHT
+            height: c.SLIDER_HEIGHT,
         });
         // 这边其实是有问题的，拖拽区域是个圆，在圆的边缘拖拽后放开，这边计算出来的蓝条宽度实际上会比放开时长一点或者短一点
-        sliderVertical.element.click(function (e) {
-            if (self.enable && self.isEnabled() && sliderVertical.element[0] === e.originalEvent.target) {
-                var offset = e.clientX - self.element.offset().left - c.SLIDER_WIDTH_HALF;
-                var trackLength = self.track.element[0].scrollWidth - c.TRACK_GAP;
-                var percent = 0;
+        sliderVertical.element.click(e => {
+            if (
+                this.enable &&
+                this.isEnabled() &&
+                sliderVertical.element[0] === e.originalEvent.target
+            ) {
+                const offset =
+                    e.clientX -
+                    this.element.offset().left -
+                    c.SLIDER_WIDTH_HALF;
+                const trackLength =
+                    this.track.element[0].scrollWidth - c.TRACK_GAP;
+                let percent = 0;
                 if (offset < 0) {
                     percent = 0;
                 }
                 if (offset > 0 && offset < trackLength) {
-                    percent = offset * 100 / self._getGrayTrackLength();
+                    percent = (offset * 100) / this._getGrayTrackLength();
                 }
                 if (offset >= trackLength) {
                     percent = 100;
                 }
-                var significantPercent = BI.parseFloat(percent.toFixed(1));
-                self._setAllPosition(significantPercent);
-                var v = self._getValueByPercent(significantPercent);
+                const significantPercent = parseFloat(percent.toFixed(1));
+                this._setAllPosition(significantPercent);
+                let v = this._getValueByPercent(significantPercent);
                 v = o.digit === false ? v : v.toFixed(o.digit);
-                self.label.setValue(v);
-                self.value = v;
-                self.fireEvent(BI.SingleSlider.EVENT_CHANGE);
+                this.label.setValue(v);
+                this.value = v;
+                this.fireEvent(SingleSlider.EVENT_CHANGE);
             }
         });
-        this.label = BI.createWidget({
+        this.label = createWidget({
             type: "bi.sign_text_editor",
             cls: "slider-editor-button",
             text: o.unit,
-            width: BI.toPix(c.EDITOR_WIDTH, 2),
-            height: BI.toPix(c.EDITOR_HEIGHT, 2),
+            width: toPix(c.EDITOR_WIDTH, 2),
+            height: toPix(c.EDITOR_HEIGHT, 2),
             allowBlank: false,
             textAlign: "center",
-            validationChecker: function (v) {
-                return self._checkValidation(v);
-            }
+            validationChecker: v => this._checkValidation(v),
         });
-        this.label.element.hover(function () {
-            self.label.element.removeClass("bi-border").addClass("bi-border");
-        }, function () {
-            self.label.element.removeClass("bi-border");
-        });
-        this.label.on(BI.SignEditor.EVENT_CONFIRM, function () {
-            var v = BI.parseFloat(this.getValue());
-            var percent = self._getPercentByValue(v);
-            var significantPercent = BI.parseFloat(percent.toFixed(1));
-            self._setAllPosition(significantPercent);
+        this.label.element.hover(
+            () => {
+                this.label.element
+                    .removeClass("bi-border")
+                    .addClass("bi-border");
+            },
+            () => {
+                this.label.element.removeClass("bi-border");
+            }
+        );
+        this.label.on(SignEditor.EVENT_CONFIRM, () => {
+            const v = parseFloat(this.getValue());
+            const percent = this._getPercentByValue(v);
+            const significantPercent = parseFloat(percent.toFixed(1));
+            this._setAllPosition(significantPercent);
             this.setValue(v);
-            self.value = v;
-            self.fireEvent(BI.SingleSlider.EVENT_CHANGE);
+            this.value = v;
+            this.fireEvent(SingleSlider.EVENT_CHANGE);
         });
         this._setVisible(false);
+        
         return {
-            type: "bi.absolute",
-            items: [{
-                el: {
-                    type: "bi.vertical",
-                    items: [{
-                        type: "bi.absolute",
-                        items: [{
-                            el: this.track,
-                            width: "100%",
-                            height: c.TRACK_HEIGHT
-                        }]
-                    }],
-                    hgap: c.TRACK_GAP_HALF,
-                    height: c.TRACK_HEIGHT
+            type: AbsoluteLayout.xtype,
+            items: [
+                {
+                    el: {
+                        type: VerticalLayout.xtype,
+                        items: [
+                            {
+                                type: AbsoluteLayout.xtype,
+                                items: [
+                                    {
+                                        el: this.track,
+                                        width: "100%",
+                                        height: c.TRACK_HEIGHT,
+                                    }
+                                ],
+                            }
+                        ],
+                        hgap: c.TRACK_GAP_HALF,
+                        height: c.TRACK_HEIGHT,
+                    },
+                    top: 23,
+                    left: 0,
+                    width: "100%",
                 },
-                top: 23,
-                left: 0,
-                width: "100%"
-            }, {
-                el: sliderVertical,
-                top: 20,
-                left: 0,
-                width: "100%"
-            }, {
-                el: {
-                    type: "bi.vertical",
-                    items: [{
-                        type: "bi.horizontal_auto",
-                        items: [this.label]
-                    }],
-                    // height: c.EDITOR_HEIGHT
+                {
+                    el: sliderVertical,
+                    top: 20,
+                    left: 0,
+                    width: "100%",
                 },
-                top: 0,
-                left: 0,
-                width: "100%"
-            }]
+                {
+                    el: {
+                        type: VerticalLayout.xtype,
+                        items: [
+                            {
+                                type: HorizontalAutoLayout.xtype,
+                                items: [this.label],
+                            }
+                        ],
+                        // height: c.EDITOR_HEIGHT
+                    },
+                    top: 0,
+                    left: 0,
+                    width: "100%",
+                }
+            ],
         };
-    },
+    }
 
-    _draggable: function (widget) {
-        var self = this, o = this.options;
-        var startDrag = false;
-        var size = 0, offset = 0, defaultSize = 0;
-        var mouseMoveTracker = new BI.MouseMoveTracker(function (deltaX) {
-            if (mouseMoveTracker.isDragging()) {
-                startDrag = true;
-                offset += deltaX;
-                size = optimizeSize(defaultSize + offset);
-                widget.element.addClass("dragging");
-                var percent = size * 100 / (self._getGrayTrackLength());
-                var significantPercent = BI.parseFloat(percent.toFixed(1));// 直接对计算出来的百分数保留到小数点后一位，相当于分成了1000份。
-                self._setBlueTrack(significantPercent);
-                self._setLabelPosition(significantPercent);
-                self._setSliderPosition(significantPercent);
-                var v = self._getValueByPercent(significantPercent);
-                v = o.digit === false ? v : v.toFixed(o.digit);
-                self.label.setValue(v);
-                self.value = v;
-            }
-        }, function () {
-            if (startDrag === true) {
-                size = optimizeSize(size);
-                var percent = size * 100 / (self._getGrayTrackLength());
-                var significantPercent = BI.parseFloat(percent.toFixed(1));
-                self._setSliderPosition(significantPercent);
-                size = 0;
-                offset = 0;
-                defaultSize = size;
-                startDrag = false;
-            }
-            widget.element.removeClass("dragging");
-            mouseMoveTracker.releaseMouseMoves();
-            self.fireEvent(BI.SingleSlider.EVENT_CHANGE);
-        }, window);
+    _draggable(widget) {
+        const o = this.options;
+        let startDrag = false;
+        let size = 0,
+            offset = 0,
+            defaultSize = 0;
+        const mouseMoveTracker = new MouseMoveTracker(
+            (deltaX => {
+                if (mouseMoveTracker.isDragging()) {
+                    startDrag = true;
+                    offset += deltaX;
+                    size = optimizeSize(defaultSize + offset);
+                    widget.element.addClass("dragging");
+                    const percent = (size * 100) / this._getGrayTrackLength();
+                    const significantPercent = parseFloat(percent.toFixed(1)); // 直接对计算出来的百分数保留到小数点后一位，相当于分成了1000份。
+                    this._setBlueTrack(significantPercent);
+                    this._setLabelPosition(significantPercent);
+                    this._setSliderPosition(significantPercent);
+                    let v = this._getValueByPercent(significantPercent);
+                    v = o.digit === false ? v : v.toFixed(o.digit);
+                    this.label.setValue(v);
+                    this.value = v;
+                }
+            }),
+            (() => {
+                if (startDrag === true) {
+                    size = optimizeSize(size);
+                    const percent = (size * 100) / this._getGrayTrackLength();
+                    const significantPercent = parseFloat(percent.toFixed(1));
+                    this._setSliderPosition(significantPercent);
+                    size = 0;
+                    offset = 0;
+                    defaultSize = size;
+                    startDrag = false;
+                }
+                widget.element.removeClass("dragging");
+                mouseMoveTracker.releaseMouseMoves();
+                this.fireEvent(SingleSlider.EVENT_CHANGE);
+            }),
+            window
+        );
         widget.element.on("mousedown", function (event) {
-            if(!widget.isEnabled()) {
+            if (!widget.isEnabled()) {
                 return;
             }
             defaultSize = this.offsetLeft;
@@ -206,100 +259,107 @@ BI.SingleSlider = BI.inherit(BI.Single, {
             mouseMoveTracker.captureMouseMoves(event);
         });
 
-        function optimizeSize (s) {
-            return BI.clamp(s, 0, self._getGrayTrackLength());
-        }
-    },
+        const optimizeSize = s => clamp(s, 0, this._getGrayTrackLength());
+    }
 
-    _createTrackWrapper: function () {
-        return BI.createWidget({
-            type: "bi.absolute",
-            items: [{
-                el: {
-                    type: "bi.vertical",
-                    items: [{
-                        type: "bi.absolute",
-                        items: [{
-                            el: this.grayTrack,
-                            top: 0,
-                            left: 0,
-                            width: "100%"
-                        }, {
-                            el: this.blueTrack,
-                            top: 0,
-                            left: 0,
-                            width: "0%"
-                        }]
-                    }],
-                    hgap: 8,
-                    height: 8
-                },
-                top: 8,
-                left: 0,
-                width: "100%"
-            }]
+    _createTrackWrapper() {
+        return createWidget({
+            type: AbsoluteLayout.xtype,
+            items: [
+                {
+                    el: {
+                        type: VerticalLayout.xtype,
+                        items: [
+                            {
+                                type: AbsoluteLayout.xtype,
+                                items: [
+                                    {
+                                        el: this.grayTrack,
+                                        top: 0,
+                                        left: 0,
+                                        width: "100%",
+                                    },
+                                    {
+                                        el: this.blueTrack,
+                                        top: 0,
+                                        left: 0,
+                                        width: "0%",
+                                    }
+                                ],
+                            }
+                        ],
+                        hgap: 8,
+                        height: 8,
+                    },
+                    top: 8,
+                    left: 0,
+                    width: "100%",
+                }
+            ],
         });
-    },
+    }
 
-    _checkValidation: function (v) {
-        var o = this.options;
-        var valid = false;
-        if (BI.isNumeric(v) && !(BI.isNull(v) || v < this.min || v > this.max)) {
-            if(o.digit === false) {
+    _checkValidation(v) {
+        const o = this.options;
+        let valid = false;
+        if (isNumeric(v) && !(isNull(v) || v < this.min || v > this.max)) {
+            if (o.digit === false) {
                 valid = true;
-            }else{
-                var dotText = (v + "").split(".")[1] || "";
-                valid = (dotText.length === o.digit);
+            } else {
+                const dotText = (`${v}`).split(".")[1] || "";
+                valid = dotText.length === o.digit;
             }
         }
+        
         return valid;
-    },
+    }
 
-    _setBlueTrack: function (percent) {
-        this.blueTrack.element.css({width: percent + "%"});
-    },
+    _setBlueTrack(percent) {
+        this.blueTrack.element.css({ width: `${percent}%` });
+    }
 
-    _setLabelPosition: function (percent) {
+    _setLabelPosition(percent) {
         // this.label.element.css({left: percent + "%"});
-    },
+    }
 
-    _setSliderPosition: function (percent) {
-        this.slider.element.css({left: percent + "%"});
-    },
+    _setSliderPosition(percent) {
+        this.slider.element.css({ left: `${percent}%` });
+    }
 
-    _setAllPosition: function (percent) {
+    _setAllPosition(percent) {
         this._setSliderPosition(percent);
         this._setLabelPosition(percent);
         this._setBlueTrack(percent);
-    },
+    }
 
-    _setVisible: function (visible) {
+    _setVisible(visible) {
         this.slider.setVisible(visible);
         this.label.setVisible(visible);
-    },
+    }
 
-    _getGrayTrackLength: function () {
+    _getGrayTrackLength() {
         return this.grayTrack.element[0].scrollWidth;
-    },
+    }
 
-    _getValueByPercent: function (percent) {
-        var thousandth = BI.parseInt(percent * 10);
-        return (((this.max - this.min) * thousandth) / 1000 + this.min);
-    },
+    _getValueByPercent(percent) {
+        const thousandth = parseInt(percent * 10);
+        
+        return ((this.max - this.min) * thousandth) / 1000 + this.min;
+    }
 
-    _getPercentByValue: function (v) {
-        return (v - this.min) * 100 / (this.max - this.min);
-    },
+    _getPercentByValue(v) {
+        return ((v - this.min) * 100) / (this.max - this.min);
+    }
 
-    getValue: function () {
+    getValue() {
         return this.value;
-    },
+    }
 
-    setValue: function (v) {
-        var o = this.options;
-        v = BI.parseFloat(v);
+    setValue(v) {
+        const o = this.options;
+        v = parseFloat(v);
         v = o.digit === false ? v : v.toFixed(o.digit);
-        if ((!isNaN(v))) {
+        if (!isNaN(v)) {
             if (this._checkValidation(v)) {
                 this.value = v;
             }
@@ -310,47 +370,63 @@ BI.SingleSlider = BI.inherit(BI.Single, {
                 this.value = this.min;
             }
         }
-    },
+    }
 
-    _setEnable: function (b) {
-        BI.SingleSlider.superclass._setEnable.apply(this, [b]);
-        if(b) {
-            this.blueTrack.element.removeClass("disabled-blue-track").addClass("blue-track");
+    _setEnable(b) {
+        super._setEnable.apply(this, [b]);
+        if (b) {
+            this.blueTrack.element
+                .removeClass("disabled-blue-track")
+                .addClass("blue-track");
         } else {
-            this.blueTrack.element.removeClass("blue-track").addClass("disabled-blue-track");
+            this.blueTrack.element
+                .removeClass("blue-track")
+                .addClass("disabled-blue-track");
         }
-    },
+    }
 
-    setMinAndMax: function (v) {
-        var minNumber = BI.parseFloat(v.min);
-        var maxNumber = BI.parseFloat(v.max);
-        if ((!isNaN(minNumber)) && (!isNaN(maxNumber)) && (maxNumber > minNumber )) {
+    setMinAndMax(v) {
+        const minNumber = parseFloat(v.min);
+        const maxNumber = parseFloat(v.max);
+        if (!isNaN(minNumber) && !isNaN(maxNumber) && maxNumber > minNumber) {
             this.min = minNumber;
             this.max = maxNumber;
         }
-    },
+    }
 
-    reset: function () {
+    reset() {
         this._setVisible(false);
         this.enable = false;
         this.value = "";
         this.min = 0;
         this.max = 0;
         this._setBlueTrack(0);
-    },
+    }
 
-    populate: function () {
-        var o = this.options;
+    populate() {
+        const o = this.options;
         if (!isNaN(this.min) && !isNaN(this.max)) {
             this._setVisible(true);
             this.enable = true;
             if (o.digit) {
-                this.label.setErrorText(BI.i18nText("BI-Basic_Please_Enter_Number_Between", this.min, this.max));
+                this.label.setErrorText(
+                    i18nText(
+                        "BI-Basic_Please_Enter_Number_Between",
+                        this.min,
+                        this.max
+                    )
+                );
             } else {
-                this.label.setErrorText(BI.i18nText("BI-Basic_Please_Enter_Integer_Number_Between", this.min, this.max));
+                this.label.setErrorText(
+                    i18nText(
+                        "BI-Basic_Please_Enter_Integer_Number_Between",
+                        this.min,
+                        this.max
+                    )
+                );
             }
 
-            if (BI.isNumeric(this.value) || BI.isNotEmptyString(this.value)) {
+            if (isNumeric(this.value) || isNotEmptyString(this.value)) {
                 this.label.setValue(this.value);
                 this._setAllPosition(this._getPercentByValue(this.value));
             } else {
@@ -359,6 +435,4 @@ BI.SingleSlider = BI.inherit(BI.Single, {
             }
         }
     }
-});
-BI.SingleSlider.EVENT_CHANGE = "EVENT_CHANGE";
-BI.shortcut("bi.single_slider", BI.SingleSlider);
+}
diff --git a/src/widget/singleslider/singleslider.label.js b/src/widget/singleslider/singleslider.label.js
index c9ec33998..1253c5681 100644
--- a/src/widget/singleslider/singleslider.label.js
+++ b/src/widget/singleslider/singleslider.label.js
@@ -1,8 +1,26 @@
-/**
- * Created by Urthur on 2017/9/12.
- */
-BI.SingleSliderLabel = BI.inherit(BI.Single, {
-    _constant: {
+import {
+    shortcut,
+    createWidget,
+    parseFloat,
+    toPix,
+    Layout,
+    VerticalAdaptLayout,
+    AbsoluteLayout,
+    VerticalLayout,
+    HorizontalAutoLayout,
+    clamp,
+    isNumeric,
+    isNull,
+    parseInt,
+    isNotEmptyString,
+    MouseMoveTracker
+} from "@/core";
+import { Single, Label } from "@/base";
+
+@shortcut()
+export class SingleSliderLabel extends Single {
+    static xtype = "bi.single_slider_label";
+    _constant = {
         EDITOR_WIDTH: 90,
         EDITOR_HEIGHT: 20,
         HEIGHT: 20,
@@ -11,19 +29,20 @@ BI.SingleSliderLabel = BI.inherit(BI.Single, {
         SLIDER_HEIGHT: 30,
         TRACK_HEIGHT: 24,
         TRACK_GAP_HALF: 7,
-        TRACK_GAP: 14
-    },
-
-    props: {
+        TRACK_GAP: 14,
+    }
+    props = {
         baseCls: "bi-single-slider-label bi-slider-track",
         digit: false,
         unit: "",
         value: "",
         min: 0,
         max: 100,
-    },
+    };
 
-    beforeMount: function () {
+    static EVENT_CHANGE = "EVENT_CHANGE";
+
+    beforeMount() {
         const { value, min, max } = this.options;
         this.setMinAndMax({
             min,
@@ -31,152 +50,179 @@ BI.SingleSliderLabel = BI.inherit(BI.Single, {
         });
         this.setValue(value);
         this.populate();
-    },
+    }
 
-    render: function () {
-        var self = this, o = this.options;
-        var c = this._constant;
+    render() {
+        const o = this.options;
+        const c = this._constant;
         this.enable = false;
         this.value = "";
 
-        this.grayTrack = BI.createWidget({
-            type: "bi.layout",
+        this.grayTrack = createWidget({
+            type: Layout.xtype,
             cls: "gray-track",
-            height: 6
+            height: 6,
         });
-        this.blueTrack = BI.createWidget({
-            type: "bi.layout",
+        this.blueTrack = createWidget({
+            type: Layout.xtype,
             cls: "blue-track bi-high-light-background",
-            height: 6
+            height: 6,
         });
         this.track = this._createTrackWrapper();
 
-        this.slider = BI.createWidget({
-            type: "bi.single_slider_button"
+        this.slider = createWidget({
+            type: "bi.single_slider_button",
         });
         this._draggable(this.slider);
-        var sliderVertical = BI.createWidget({
-            type: "bi.vertical_adapt",
+        const sliderVertical = createWidget({
+            type: VerticalAdaptLayout.xtype,
             columnSize: ["fill"],
-            items: [{
-                type: "bi.absolute",
-                items: [
-                    {
-                        el: this.slider,
-                        top: 8,
-                    }
-                ],
-                height: c.SLIDER_HEIGHT
-            }],
+            items: [
+                {
+                    type: AbsoluteLayout.xtype,
+                    items: [
+                        {
+                            el: this.slider,
+                            top: 8,
+                        }
+                    ],
+                    height: c.SLIDER_HEIGHT,
+                }
+            ],
             hgap: c.SLIDER_WIDTH_HALF,
-            height: c.SLIDER_HEIGHT
+            height: c.SLIDER_HEIGHT,
         });
-        sliderVertical.element.click(function (e) {
-            if (self.enable && self.isEnabled() && sliderVertical.element[0] === e.originalEvent.target) {
-                var offset = e.clientX - self.element.offset().left - c.SLIDER_WIDTH_HALF;
-                var trackLength = self.track.element[0].scrollWidth - c.TRACK_GAP;
-                var percent = 0;
+        sliderVertical.element.click(e => {
+            if (
+                this.enable &&
+                this.isEnabled() &&
+                sliderVertical.element[0] === e.originalEvent.target
+            ) {
+                const offset =
+                    e.clientX -
+                    this.element.offset().left -
+                    c.SLIDER_WIDTH_HALF;
+                const trackLength =
+                    this.track.element[0].scrollWidth - c.TRACK_GAP;
+                let percent = 0;
                 if (offset < 0) {
                     percent = 0;
                 }
                 if (offset > 0 && offset < trackLength) {
-                    percent = offset * 100 / self._getGrayTrackLength();
+                    percent = (offset * 100) / this._getGrayTrackLength();
                 }
                 if (offset >= trackLength) {
                     percent = 100;
                 }
-                var significantPercent = BI.parseFloat(percent.toFixed(1));
-                self._setAllPosition(significantPercent);
-                var v = self._getValueByPercent(significantPercent);
+                const significantPercent = parseFloat(percent.toFixed(1));
+                this._setAllPosition(significantPercent);
+                let v = this._getValueByPercent(significantPercent);
                 v = o.digit === false ? v : v.toFixed(o.digit);
-                self.label.setText(v + o.unit);
-                self.value = v;
-                self.fireEvent(BI.SingleSliderLabel.EVENT_CHANGE);
+                this.label.setText(v + o.unit);
+                this.value = v;
+                this.fireEvent(SingleSliderLabel.EVENT_CHANGE);
             }
         });
-        this.label = BI.createWidget({
-            type: "bi.label",
+        this.label = createWidget({
+            type: Label.xtype,
             height: c.HEIGHT,
-            width: BI.toPix(c.EDITOR_WIDTH, 2)
+            width: toPix(c.EDITOR_WIDTH, 2),
         });
 
         this._setVisible(false);
-        return ({
-            type: "bi.absolute",
-            items: [{
-                el: {
-                    type: "bi.vertical",
-                    items: [{
-                        type: "bi.absolute",
-                        items: [{
-                            el: this.track,
-                            width: "100%",
-                            height: c.TRACK_HEIGHT
-                        }]
-                    }],
-                    hgap: c.TRACK_GAP_HALF,
-                    height: c.TRACK_HEIGHT
+        
+        return {
+            type: AbsoluteLayout.xtype,
+            items: [
+                {
+                    el: {
+                        type: VerticalLayout.xtype,
+                        items: [
+                            {
+                                type: AbsoluteLayout.xtype,
+                                items: [
+                                    {
+                                        el: this.track,
+                                        width: "100%",
+                                        height: c.TRACK_HEIGHT,
+                                    }
+                                ],
+                            }
+                        ],
+                        hgap: c.TRACK_GAP_HALF,
+                        height: c.TRACK_HEIGHT,
+                    },
+                    top: 13,
+                    left: 0,
+                    width: "100%",
                 },
-                top: 13,
-                left: 0,
-                width: "100%"
-            }, {
-                el: sliderVertical,
-                top: 10,
-                left: 0,
-                width: "100%"
-            }, {
-                el: {
-                    type: "bi.vertical",
-                    items: [{
-                        type: "bi.horizontal_auto",
-                        items: [this.label]
-                    }],
-                    height: c.EDITOR_HEIGHT
+                {
+                    el: sliderVertical,
+                    top: 10,
+                    left: 0,
+                    width: "100%",
                 },
-                top: 0,
-                left: 0,
-                width: "100%"
-            }]
-        });
-    },
+                {
+                    el: {
+                        type: VerticalLayout.xtype,
+                        items: [
+                            {
+                                type: HorizontalAutoLayout.xtype,
+                                items: [this.label],
+                            }
+                        ],
+                        height: c.EDITOR_HEIGHT,
+                    },
+                    top: 0,
+                    left: 0,
+                    width: "100%",
+                }
+            ],
+        };
+    }
 
-    _draggable: function (widget) {
-        var self = this, o = this.options;
-        var startDrag = false;
-        var size = 0, offset = 0, defaultSize = 0;
-        var mouseMoveTracker = new BI.MouseMoveTracker(function (deltaX) {
-            if (mouseMoveTracker.isDragging()) {
-                startDrag = true;
-                offset += deltaX;
-                size = optimizeSize(defaultSize + offset);
-                widget.element.addClass("dragging");
-                var percent = size * 100 / (self._getGrayTrackLength());
-                var significantPercent = BI.parseFloat(percent.toFixed(1));// 直接对计算出来的百分数保留到小数点后一位，相当于分成了1000份。
-                self._setBlueTrack(significantPercent);
-                self._setLabelPosition(significantPercent);
-                self._setSliderPosition(significantPercent);
-                var v = self._getValueByPercent(significantPercent);
-                v = o.digit === false ? v : v.toFixed(o.digit);
-                self.label.setValue(v + o.unit);
-                self.value = v;
-                self.fireEvent(BI.SingleSliderLabel.EVENT_CHANGE);
-            }
-        }, function () {
-            if (startDrag === true) {
-                size = optimizeSize(size);
-                var percent = size * 100 / (self._getGrayTrackLength());
-                var significantPercent = BI.parseFloat(percent.toFixed(1));
-                self._setSliderPosition(significantPercent);
-                size = 0;
-                offset = 0;
-                defaultSize = size;
-                startDrag = false;
-            }
-            widget.element.removeClass("dragging");
-            mouseMoveTracker.releaseMouseMoves();
-            self.fireEvent(BI.SingleSliderLabel.EVENT_CHANGE);
-        }, window);
+    _draggable(widget) {
+        const o = this.options;
+        let startDrag = false;
+        let size = 0,
+            offset = 0,
+            defaultSize = 0;
+        const mouseMoveTracker = new MouseMoveTracker(
+            (deltaX => {
+                if (mouseMoveTracker.isDragging()) {
+                    startDrag = true;
+                    offset += deltaX;
+                    size = optimizeSize(defaultSize + offset);
+                    widget.element.addClass("dragging");
+                    const percent = (size * 100) / this._getGrayTrackLength();
+                    const significantPercent = parseFloat(percent.toFixed(1)); // 直接对计算出来的百分数保留到小数点后一位，相当于分成了1000份。
+                    this._setBlueTrack(significantPercent);
+                    this._setLabelPosition(significantPercent);
+                    this._setSliderPosition(significantPercent);
+                    let v = this._getValueByPercent(significantPercent);
+                    v = o.digit === false ? v : v.toFixed(o.digit);
+                    this.label.setValue(v + o.unit);
+                    this.value = v;
+                    this.fireEvent(SingleSliderLabel.EVENT_CHANGE);
+                }
+            }),
+            (() => {
+                if (startDrag === true) {
+                    size = optimizeSize(size);
+                    const percent = (size * 100) / this._getGrayTrackLength();
+                    const significantPercent = parseFloat(percent.toFixed(1));
+                    this._setSliderPosition(significantPercent);
+                    size = 0;
+                    offset = 0;
+                    defaultSize = size;
+                    startDrag = false;
+                }
+                widget.element.removeClass("dragging");
+                mouseMoveTracker.releaseMouseMoves();
+                this.fireEvent(SingleSliderLabel.EVENT_CHANGE);
+            }),
+            window
+        );
         widget.element.on("mousedown", function (event) {
             if (!widget.isEnabled()) {
                 return;
@@ -186,99 +232,109 @@ BI.SingleSliderLabel = BI.inherit(BI.Single, {
             mouseMoveTracker.captureMouseMoves(event);
         });
 
-        function optimizeSize(s) {
-            return BI.clamp(s, 0, self._getGrayTrackLength());
-        }
-    },
+        const optimizeSize = s => clamp(s, 0, this._getGrayTrackLength());
+    }
 
-    _createTrackWrapper: function () {
-        return BI.createWidget({
-            type: "bi.absolute",
-            items: [{
-                el: {
-                    type: "bi.vertical",
-                    items: [{
-                        type: "bi.absolute",
-                        items: [{
-                            el: this.grayTrack,
-                            top: 0,
-                            left: 0,
-                            width: "100%"
-                        }, {
-                            el: this.blueTrack,
-                            top: 0,
-                            left: 0,
-                            width: "0%"
-                        }]
-                    }],
-                    hgap: 8,
-                    height: 8
-                },
-                top: 8,
-                left: 0,
-                width: "100%"
-            }]
+    _createTrackWrapper() {
+        return createWidget({
+            type: AbsoluteLayout.xtype,
+            items: [
+                {
+                    el: {
+                        type: VerticalLayout.xtype,
+                        items: [
+                            {
+                                type: AbsoluteLayout.xtype,
+                                items: [
+                                    {
+                                        el: this.grayTrack,
+                                        top: 0,
+                                        left: 0,
+                                        width: "100%",
+                                    },
+                                    {
+                                        el: this.blueTrack,
+                                        top: 0,
+                                        left: 0,
+                                        width: "0%",
+                                    }
+                                ],
+                            }
+                        ],
+                        hgap: 8,
+                        height: 8,
+                    },
+                    top: 8,
+                    left: 0,
+                    width: "100%",
+                }
+            ],
         });
-    },
+    }
 
-    _checkValidation: function (v) {
-        return BI.isNumeric(v) && !(BI.isNull(v) || v < this.min || v > this.max);
-    },
+    _checkValidation(v) {
+        return isNumeric(v) && !(isNull(v) || v < this.min || v > this.max);
+    }
 
-    _setBlueTrack: function (percent) {
-        this.blueTrack.element.css({ width: percent + "%" });
-    },
+    _setBlueTrack(percent) {
+        this.blueTrack.element.css({ width: `${percent}%` });
+    }
 
-    _setLabelPosition: function (percent) {
+    _setLabelPosition(percent) {
         // this.label.element.css({left: percent + "%"});
-    },
+    }
 
-    _setSliderPosition: function (percent) {
-        this.slider.element.css({ left: percent + "%" });
-    },
+    _setSliderPosition(percent) {
+        this.slider.element.css({ left: `${percent}%` });
+    }
 
-    _setAllPosition: function (percent) {
+    _setAllPosition(percent) {
         this._setSliderPosition(percent);
         this._setLabelPosition(percent);
         this._setBlueTrack(percent);
-    },
+    }
 
-    _setVisible: function (visible) {
+    _setVisible(visible) {
         this.slider.setVisible(visible);
         this.label.setVisible(visible);
-    },
+    }
 
-    _getGrayTrackLength: function () {
+    _getGrayTrackLength() {
         return this.grayTrack.element[0].scrollWidth;
-    },
+    }
 
-    _getValueByPercent: function (percent) {
-        var thousandth = BI.parseInt(percent * 10);
-        return (((this.max - this.min) * thousandth) / 1000 + this.min);
-    },
+    _getValueByPercent(percent) {
+        const thousandth = parseInt(percent * 10);
+        
+        return ((this.max - this.min) * thousandth) / 1000 + this.min;
+    }
 
-    _getPercentByValue: function (v) {
-        return (v - this.min) * 100 / (this.max - this.min);
-    },
+    _getPercentByValue(v) {
+        return ((v - this.min) * 100) / (this.max - this.min);
+    }
 
-    _setEnable: function (b) {
-        BI.SingleSliderLabel.superclass._setEnable.apply(this, [b]);
+    _setEnable(b) {
+        super._setEnable.apply(this, [b]);
         if (b) {
-            this.blueTrack.element.removeClass("disabled-blue-track").addClass("blue-track");
+            this.blueTrack.element
+                .removeClass("disabled-blue-track")
+                .addClass("blue-track");
         } else {
-            this.blueTrack.element.removeClass("blue-track").addClass("disabled-blue-track");
+            this.blueTrack.element
+                .removeClass("blue-track")
+                .addClass("disabled-blue-track");
         }
-    },
+    }
 
-    getValue: function () {
+    getValue() {
         return this.value;
-    },
+    }
 
-    setValue: function (v) {
-        var o = this.options;
-        v = BI.parseFloat(v);
+    setValue(v) {
+        const o = this.options;
+        v = parseFloat(v);
         v = o.digit === false ? v : v.toFixed(o.digit);
-        if ((!isNaN(v))) {
+        if (!isNaN(v)) {
             if (this._checkValidation(v)) {
                 this.value = v;
             }
@@ -289,32 +345,32 @@ BI.SingleSliderLabel = BI.inherit(BI.Single, {
                 this.value = this.min;
             }
         }
-    },
+    }
 
-    setMinAndMax: function (v) {
-        var minNumber = BI.parseFloat(v.min);
-        var maxNumber = BI.parseFloat(v.max);
-        if ((!isNaN(minNumber)) && (!isNaN(maxNumber)) && (maxNumber > minNumber)) {
+    setMinAndMax(v) {
+        const minNumber = parseFloat(v.min);
+        const maxNumber = parseFloat(v.max);
+        if (!isNaN(minNumber) && !isNaN(maxNumber) && maxNumber > minNumber) {
             this.min = minNumber;
             this.max = maxNumber;
         }
-    },
+    }
 
-    reset: function () {
+    reset() {
         this._setVisible(false);
         this.enable = false;
         this.value = "";
         this.min = 0;
         this.max = 0;
         this._setBlueTrack(0);
-    },
+    }
 
-    populate: function () {
-        var o = this.options;
+    populate() {
+        const o = this.options;
         if (!isNaN(this.min) && !isNaN(this.max)) {
             this._setVisible(true);
             this.enable = true;
-            if (BI.isNumeric(this.value) || BI.isNotEmptyString(this.value)) {
+            if (isNumeric(this.value) || isNotEmptyString(this.value)) {
                 this.label.setValue(this.value + o.unit);
                 this._setAllPosition(this._getPercentByValue(this.value));
             } else {
@@ -323,6 +379,4 @@ BI.SingleSliderLabel = BI.inherit(BI.Single, {
             }
         }
     }
-});
-BI.SingleSliderLabel.EVENT_CHANGE = "EVENT_CHANGE";
-BI.shortcut("bi.single_slider_label", BI.SingleSliderLabel);
+}
diff --git a/src/widget/singleslider/singleslider.normal.js b/src/widget/singleslider/singleslider.normal.js
index 1f7338530..993e86043 100644
--- a/src/widget/singleslider/singleslider.normal.js
+++ b/src/widget/singleslider/singleslider.normal.js
@@ -1,28 +1,43 @@
-/**
- * normal single slider
- * Created by Young on 2017/6/21.
- */
-BI.SingleSliderNormal = BI.inherit(BI.Single, {
+import {
+    shortcut,
+    createWidget,
+    parseFloat,
+    VerticalAdaptLayout,
+    AbsoluteLayout,
+    VerticalLayout,
+    clamp,
+    Layout,
+    isNull,
+    parseInt,
+    isNumeric,
+    isNotEmptyString,
+    MouseMoveTracker
+} from "@/core";
+import { Single } from "@/base";
+import { SingleSlider } from "./singleslider";
 
-    _constant: {
+@shortcut()
+export class SingleSliderNormal extends Single {
+    static xtype = "bi.single_slider_normal";
+    _constant = {
         HEIGHT: 28,
         SLIDER_WIDTH_HALF: 15,
         SLIDER_WIDTH: 30,
         SLIDER_HEIGHT: 30,
         TRACK_HEIGHT: 24,
         TRACK_GAP_HALF: 7,
-        TRACK_GAP: 14
-    },
-
-    props: {
+        TRACK_GAP: 14,
+    }
+    props = {
         baseCls: "bi-single-slider-normal bi-slider-track",
         min: 0,
         max: 100,
         value: "",
-        // color: "#3f8ce8"
-    },
+    };
 
-    beforeMount: function () {
+    static EVENT_DRAG = "EVENT_DRAG";
+
+    beforeMount() {
         const { value, min, max } = this.options;
         this.setMinAndMax({
             min,
@@ -30,122 +45,143 @@ BI.SingleSliderNormal = BI.inherit(BI.Single, {
         });
         this.setValue(value);
         this.populate();
-    },
+    }
 
-    render: function () {
-        var self = this;
-        var o = this.options;
-        var c = this._constant;
+    render() {
+        const c = this._constant;
 
-        var track = this._createTrack();
-        this.slider = BI.createWidget({
-            type: "bi.single_slider_button"
+        const track = this._createTrack();
+        this.slider = createWidget({
+            type: "bi.single_slider_button",
         });
         this._draggable(this.slider);
 
-        var sliderVertical = BI.createWidget({
-            type: "bi.vertical_adapt",
+        const sliderVertical = createWidget({
+            type: VerticalAdaptLayout.xtype,
             columnSize: ["fill"],
-            items: [{
-                type: "bi.absolute",
-                items: [
-                    {
-                        el: this.slider,
-                        top: 8,
-                    }
-                ],
-                height: c.SLIDER_HEIGHT
-            }],
+            items: [
+                {
+                    type: AbsoluteLayout.xtype,
+                    items: [
+                        {
+                            el: this.slider,
+                            top: 8,
+                        }
+                    ],
+                    height: c.SLIDER_HEIGHT,
+                }
+            ],
             hgap: c.SLIDER_WIDTH_HALF,
-            height: c.SLIDER_HEIGHT
+            height: c.SLIDER_HEIGHT,
         });
-        sliderVertical.element.click(function (e) {
-            if (self.enable && self.isEnabled() && sliderVertical.element[0] === e.originalEvent.target) {
-                var offset = e.clientX - self.element.offset().left - c.SLIDER_WIDTH_HALF;
-                var trackLength = self.track.element[0].scrollWidth - c.TRACK_GAP;
-                var percent = 0;
+        sliderVertical.element.click(e => {
+            if (
+                this.enable &&
+                this.isEnabled() &&
+                sliderVertical.element[0] === e.originalEvent.target
+            ) {
+                const offset =
+                    e.clientX -
+                    this.element.offset().left -
+                    c.SLIDER_WIDTH_HALF;
+                const trackLength =
+                    this.track.element[0].scrollWidth - c.TRACK_GAP;
+                let percent = 0;
                 if (offset < 0) {
                     percent = 0;
                 }
                 if (offset > 0 && offset < trackLength) {
-                    percent = offset * 100 / self._getGrayTrackLength();
+                    percent = (offset * 100) / this._getGrayTrackLength();
                 }
                 if (offset >= trackLength) {
                     percent = 100;
                 }
-                var significantPercent = BI.parseFloat(percent.toFixed(1));
-                self._setAllPosition(significantPercent);
-                var v = self._getValueByPercent(significantPercent);
-                self.value = v;
-                self.fireEvent(BI.SingleSlider.EVENT_CHANGE);
+                const significantPercent = parseFloat(percent.toFixed(1));
+                this._setAllPosition(significantPercent);
+                const v = this._getValueByPercent(significantPercent);
+                this.value = v;
+                this.fireEvent(SingleSlider.EVENT_CHANGE);
             }
         });
 
         return {
-            type: "bi.absolute",
+            type: AbsoluteLayout.xtype,
             element: this,
-            items: [{
-                el: {
-                    type: "bi.vertical",
-                    items: [{
-                        type: "bi.absolute",
-                        items: [{
-                            el: track,
-                            width: "100%",
-                            height: c.TRACK_HEIGHT
-                        }]
-                    }],
-                    hgap: c.TRACK_GAP_HALF,
-                    height: c.TRACK_HEIGHT
+            items: [
+                {
+                    el: {
+                        type: VerticalLayout.xtype,
+                        items: [
+                            {
+                                type: AbsoluteLayout.xtype,
+                                items: [
+                                    {
+                                        el: track,
+                                        width: "100%",
+                                        height: c.TRACK_HEIGHT,
+                                    }
+                                ],
+                            }
+                        ],
+                        hgap: c.TRACK_GAP_HALF,
+                        height: c.TRACK_HEIGHT,
+                    },
+                    top: 3,
+                    left: 0,
+                    width: "100%",
                 },
-                top: 3,
-                left: 0,
-                width: "100%"
-            }, {
-                el: sliderVertical,
-                top: 0,
-                left: 0,
-                width: "100%"
-            }]
+                {
+                    el: sliderVertical,
+                    top: 0,
+                    left: 0,
+                    width: "100%",
+                }
+            ],
         };
-    },
+    }
 
-    _draggable: function (widget) {
-        var self = this, o = this.options;
-        var startDrag = false;
-        var size = 0, offset = 0, defaultSize = 0;
-        var mouseMoveTracker = new BI.MouseMoveTracker(function (deltaX) {
-            if (mouseMoveTracker.isDragging()) {
-                startDrag = true;
-                offset += deltaX;
-                size = optimizeSize(defaultSize + offset);
-                widget.element.addClass("dragging");
-                var percent = size * 100 / (self._getGrayTrackLength());
-                var significantPercent = BI.parseFloat(percent.toFixed(1));// 直接对计算出来的百分数保留到小数点后一位，相当于分成了1000份。
-                self._setBlueTrack(significantPercent);
-                self._setSliderPosition(significantPercent);
-                var v = self._getValueByPercent(significantPercent);
-                v = o.digit === false ? v : v.toFixed(o.digit);
-                self.value = v;
-                self.fireEvent(BI.SingleSliderNormal.EVENT_DRAG, v);
-            }
-        }, function () {
-            if (startDrag === true) {
-                size = optimizeSize(size);
-                var percent = size * 100 / (self._getGrayTrackLength());
-                var significantPercent = BI.parseFloat(percent.toFixed(1));
-                self._setSliderPosition(significantPercent);
-                size = 0;
-                offset = 0;
-                defaultSize = size;
-                startDrag = false;
-            }
-            widget.element.removeClass("dragging");
-            mouseMoveTracker.releaseMouseMoves();
-            self.fireEvent(BI.SingleSlider.EVENT_CHANGE);
-        }, window);
+    _draggable(widget) {
+        const o = this.options;
+        let startDrag = false;
+        let size = 0,
+            offset = 0,
+            defaultSize = 0;
+        const mouseMoveTracker = new MouseMoveTracker(
+            (deltaX => {
+                if (mouseMoveTracker.isDragging()) {
+                    startDrag = true;
+                    offset += deltaX;
+                    size = optimizeSize(defaultSize + offset);
+                    widget.element.addClass("dragging");
+                    const percent = (size * 100) / this._getGrayTrackLength();
+                    const significantPercent = parseFloat(percent.toFixed(1)); // 直接对计算出来的百分数保留到小数点后一位，相当于分成了1000份。
+                    this._setBlueTrack(significantPercent);
+                    this._setSliderPosition(significantPercent);
+                    let v = this._getValueByPercent(significantPercent);
+                    v = o.digit === false ? v : v.toFixed(o.digit);
+                    this.value = v;
+                    this.fireEvent(SingleSliderNormal.EVENT_DRAG, v);
+                }
+            }),
+            (() => {
+                if (startDrag === true) {
+                    size = optimizeSize(size);
+                    const percent = (size * 100) / this._getGrayTrackLength();
+                    const significantPercent = parseFloat(percent.toFixed(1));
+                    this._setSliderPosition(significantPercent);
+                    size = 0;
+                    offset = 0;
+                    defaultSize = size;
+                    startDrag = false;
+                }
+                widget.element.removeClass("dragging");
+                mouseMoveTracker.releaseMouseMoves();
+                this.fireEvent(SingleSlider.EVENT_CHANGE);
+            }),
+            window
+        );
         widget.element.on("mousedown", function (event) {
-            if(!widget.isEnabled()) {
+            if (!widget.isEnabled()) {
                 return;
             }
             defaultSize = this.offsetLeft;
@@ -153,110 +189,120 @@ BI.SingleSliderNormal = BI.inherit(BI.Single, {
             mouseMoveTracker.captureMouseMoves(event);
         });
 
-        function optimizeSize (s) {
-            return BI.clamp(s, 0, self._getGrayTrackLength());
-        }
-    },
+        const optimizeSize = s => clamp(s, 0, this._getGrayTrackLength());
+    }
 
-    _createTrack: function () {
-        var self = this;
-        var c = this._constant;
-        this.grayTrack = BI.createWidget({
-            type: "bi.layout",
+    _createTrack() {
+        this.grayTrack = createWidget({
+            type: Layout.xtype,
             cls: "gray-track",
-            height: 6
+            height: 6,
         });
-        this.blueTrack = BI.createWidget({
-            type: "bi.layout",
+        this.blueTrack = createWidget({
+            type: Layout.xtype,
             cls: "blue-track bi-high-light-background",
-            height: 6
+            height: 6,
         });
         if (this.options.color) {
-            this.blueTrack.element.css({"background-color": this.options.color});
+            this.blueTrack.element.css({
+                "background-color": this.options.color,
+            });
         }
 
         return {
-            type: "bi.absolute",
-            items: [{
-                el: {
-                    type: "bi.vertical",
-                    items: [{
-                        type: "bi.absolute",
-                        items: [{
-                            el: this.grayTrack,
-                            top: 0,
-                            left: 0,
-                            width: "100%"
-                        }, {
-                            el: this.blueTrack,
-                            top: 0,
-                            left: 0,
-                            width: "0%"
-                        }]
-                    }],
-                    hgap: 8,
-                    height: 8
-                },
-                top: 8,
-                left: 0,
-                width: "100%"
-            }],
-            ref: function (ref) {
-                self.track = ref;
-            }
+            type: AbsoluteLayout.xtype,
+            items: [
+                {
+                    el: {
+                        type: VerticalLayout.xtype,
+                        items: [
+                            {
+                                type: AbsoluteLayout.xtype,
+                                items: [
+                                    {
+                                        el: this.grayTrack,
+                                        top: 0,
+                                        left: 0,
+                                        width: "100%",
+                                    },
+                                    {
+                                        el: this.blueTrack,
+                                        top: 0,
+                                        left: 0,
+                                        width: "0%",
+                                    }
+                                ],
+                            }
+                        ],
+                        hgap: 8,
+                        height: 8,
+                    },
+                    top: 8,
+                    left: 0,
+                    width: "100%",
+                }
+            ],
+            ref: _ref => {
+                this.track = _ref;
+            },
         };
-    },
+    }
 
-    _checkValidation: function (v) {
-        return !(BI.isNull(v) || v < this.min || v > this.max);
-    },
+    _checkValidation(v) {
+        return !(isNull(v) || v < this.min || v > this.max);
+    }
 
-    _setBlueTrack: function (percent) {
-        this.blueTrack.element.css({width: percent + "%"});
-    },
+    _setBlueTrack(percent) {
+        this.blueTrack.element.css({ width: `${percent}%` });
+    }
 
-    _setSliderPosition: function (percent) {
-        this.slider.element.css({left: percent + "%"});
-    },
+    _setSliderPosition(percent) {
+        this.slider.element.css({ left: `${percent}%` });
+    }
 
-    _setAllPosition: function (percent) {
+    _setAllPosition(percent) {
         this._setSliderPosition(percent);
         this._setBlueTrack(percent);
-    },
+    }
 
-    _setVisible: function (visible) {
+    _setVisible(visible) {
         this.slider.setVisible(visible);
-    },
+    }
 
-    _getGrayTrackLength: function () {
+    _getGrayTrackLength() {
         return this.grayTrack.element[0].scrollWidth;
-    },
+    }
 
-    _getValueByPercent: function (percent) {
-        var thousandth = BI.parseInt(percent * 10);
-        return (((this.max - this.min) * thousandth) / 1000 + this.min);
-    },
+    _getValueByPercent(percent) {
+        const thousandth = parseInt(percent * 10);
+        
+        return ((this.max - this.min) * thousandth) / 1000 + this.min;
+    }
 
-    _getPercentByValue: function (v) {
-        return (v - this.min) * 100 / (this.max - this.min);
-    },
+    _getPercentByValue(v) {
+        return ((v - this.min) * 100) / (this.max - this.min);
+    }
 
-    _setEnable: function (b) {
-        BI.SingleSliderNormal.superclass._setEnable.apply(this, [b]);
-        if(b) {
-            this.blueTrack.element.removeClass("disabled-blue-track").addClass("blue-track");
+    _setEnable(b) {
+        super._setEnable.apply(this, [b]);
+        if (b) {
+            this.blueTrack.element
+                .removeClass("disabled-blue-track")
+                .addClass("blue-track");
         } else {
-            this.blueTrack.element.removeClass("blue-track").addClass("disabled-blue-track");
+            this.blueTrack.element
+                .removeClass("blue-track")
+                .addClass("disabled-blue-track");
         }
-    },
+    }
 
-    getValue: function () {
+    getValue() {
         return this.value;
-    },
+    }
 
-    setValue: function (v) {
-        var value = BI.parseFloat(v);
-        if ((!isNaN(value))) {
+    setValue(v) {
+        const value = parseFloat(v);
+        if (!isNaN(value)) {
             if (this._checkValidation(value)) {
                 this.value = value;
             }
@@ -267,37 +313,35 @@ BI.SingleSliderNormal = BI.inherit(BI.Single, {
                 this.value = this.min;
             }
         }
-    },
+    }
 
-    setMinAndMax: function (v) {
-        var minNumber = BI.parseFloat(v.min);
-        var maxNumber = BI.parseFloat(v.max);
-        if ((!isNaN(minNumber)) && (!isNaN(maxNumber)) && (maxNumber > minNumber )) {
+    setMinAndMax(v) {
+        const minNumber = parseFloat(v.min);
+        const maxNumber = parseFloat(v.max);
+        if (!isNaN(minNumber) && !isNaN(maxNumber) && maxNumber > minNumber) {
             this.min = minNumber;
             this.max = maxNumber;
         }
-    },
+    }
 
-    reset: function () {
+    reset() {
         this._setVisible(false);
         this.enable = false;
         this.value = "";
         this.min = 0;
         this.max = 0;
         this._setBlueTrack(0);
-    },
+    }
 
-    populate: function () {
+    populate() {
         if (!isNaN(this.min) && !isNaN(this.max)) {
             this._setVisible(true);
             this.enable = true;
-            if (BI.isNumeric(this.value) || BI.isNotEmptyString(this.value)) {
+            if (isNumeric(this.value) || isNotEmptyString(this.value)) {
                 this._setAllPosition(this._getPercentByValue(this.value));
             } else {
                 this._setAllPosition(100);
             }
         }
     }
-});
-BI.SingleSliderNormal.EVENT_DRAG = "EVENT_DRAG";
-BI.shortcut("bi.single_slider_normal", BI.SingleSliderNormal);
+}