add

bi/base.js

@@ -18489,6 +18489,9 @@ BI.Icon = BI.inherit(BI.Single, {
     },
     _init: function () {
         BI.Icon.superclass._init.apply(this, arguments);
+        if (BI.isIE9Below()) {
+            this.element.addClass("hack");
+        }
     }
 });
 BI.shortcut("bi.icon", BI.Icon);/**

docs/base.js

@@ -18489,6 +18489,9 @@ BI.Icon = BI.inherit(BI.Single, {
     },
     _init: function () {
         BI.Icon.superclass._init.apply(this, arguments);
+        if (BI.isIE9Below()) {
+            this.element.addClass("hack");
+        }
     }
 });
 BI.shortcut("bi.icon", BI.Icon);/**

docs/demo.js

@@ -7105,6 +7105,515 @@ Demo.Month = BI.inherit(BI.Widget, {
 })
 
 BI.shortcut("demo.month", Demo.Month);/**
+ * Created by Urthur on 2017/7/14.
+ */
+BI.MultiDateTimeCombo = BI.inherit(BI.Single, {
+    constants: {
+        popupHeight: 290,
+        popupWidth: 270,
+        comboAdjustHeight: 1,
+        border: 1,
+        DATE_MIN_VALUE: "1900-01-01",
+        DATE_MAX_VALUE: "2099-12-31"
+    },
+    _defaultConfig: function () {
+        return BI.extend(BI.MultiDateTimeCombo.superclass._defaultConfig.apply(this, arguments), {
+            baseCls: 'bi-multi-date-time-combo bi-border',
+            height: 24
+        });
+    },
+    _init: function () {
+        BI.MultiDateTimeCombo.superclass._init.apply(this, arguments);
+        var self = this, opts = this.options;
+        var date = new Date();
+        this.storeValue = {
+            value: {
+                year: date.getFullYear(),
+                month: date.getMonth(),
+                day: date.getDate(),
+                hour: date.getHours(),
+                minute: date.getMinutes(),
+                second: date.getSeconds()
+            }
+        };
+        this.trigger = BI.createWidget({
+            type: 'bi.date_time_trigger',
+            min: this.constants.DATE_MIN_VALUE,
+            max: this.constants.DATE_MAX_VALUE
+        });
+
+        this.popup = BI.createWidget({
+            type: "bi.multi_date_time_popup",
+            min: this.constants.DATE_MIN_VALUE,
+            max: this.constants.DATE_MAX_VALUE
+        });
+        self.setValue(this.storeValue);
+
+        this.popup.on(BI.MultiDateTimePopup.BUTTON_CANCEL_EVENT_CHANGE, function () {
+            self.combo.hideView();
+            self.fireEvent(BI.MultiDateTimeCombo.EVENT_CANCEL);
+        });
+        this.popup.on(BI.MultiDateTimePopup.BUTTON_OK_EVENT_CHANGE, function () {
+            self.setValue(self.popup.getValue());
+            self.combo.hideView();
+            self.fireEvent(BI.MultiDateTimeCombo.EVENT_CONFIRM);
+        });
+        this.popup.on(BI.MultiDateTimePopup.CALENDAR_EVENT_CHANGE, function () {
+            self.setValue(self.popup.getValue());
+        });
+        this.combo = BI.createWidget({
+            type: 'bi.combo',
+            toggle: false,
+            isNeedAdjustHeight: false,
+            isNeedAdjustWidth: false,
+            el: this.trigger,
+            adjustLength: this.constants.comboAdjustHeight,
+            popup: {
+                el: this.popup,
+                maxHeight: this.constants.popupHeight,
+                width: this.constants.popupWidth,
+                stopPropagation: false
+            }
+        });
+        this.combo.on(BI.Combo.EVENT_BEFORE_POPUPVIEW, function () {
+            self.popup.setValue(self.storeValue);
+            self.fireEvent(BI.MultiDateTimeCombo.EVENT_BEFORE_POPUPVIEW);
+        });
+
+        var triggerBtn = BI.createWidget({
+            type: "bi.trigger_icon_button",
+            cls: "bi-trigger-date-button chart-date-normal-font bi-border-right",
+            width: 30,
+            height: 24
+        });
+        triggerBtn.on(BI.TriggerIconButton.EVENT_CHANGE, function () {
+            if (self.combo.isViewVisible()) {
+                self.combo.hideView();
+            } else {
+                self.combo.showView();
+            }
+        });
+
+        BI.createWidget({
+            type: "bi.htape",
+            element: this,
+            items: [{
+                type: "bi.absolute",
+                items: [{
+                    el: this.combo,
+                    top: 0,
+                    left: 0,
+                    right: 0,
+                    bottom: 0
+                }, {
+                    el: triggerBtn,
+                    top: 0,
+                    left: 0
+                }]
+            }]
+        })
+    },
+
+    setValue: function (v) {
+        this.storeValue = v;
+        this.popup.setValue(v);
+        this.trigger.setValue(v);
+    },
+    getValue: function () {
+        return this.storeValue;
+    }
+});
+
+BI.MultiDateTimeCombo.EVENT_CANCEL = "EVENT_CANCEL";
+BI.MultiDateTimeCombo.EVENT_CONFIRM = "EVENT_CONFIRM";
+BI.MultiDateTimeCombo.EVENT_CHANGE = "EVENT_CHANGE";
+BI.MultiDateTimeCombo.EVENT_BEFORE_POPUPVIEW = "BI.MultiDateTimeCombo.EVENT_BEFORE_POPUPVIEW";
+BI.shortcut('bi.multi_date_time_combo', BI.MultiDateTimeCombo);
+/**
+ * Created by Urthur on 2017/7/14.
+ */
+BI.CustomMultiDateTimeCombo = BI.inherit(BI.Widget, {
+    _defaultConfig: function () {
+        return BI.extend(BI.CustomMultiDateTimeCombo.superclass._defaultConfig.apply(this, arguments), {
+            baseCls: "bi-custom-multi-date-time-combo"
+        })
+    },
+
+    _init: function () {
+        BI.CustomMultiDateTimeCombo.superclass._init.apply(this, arguments);
+        var self = this;
+        this.multiDateTime = BI.createWidget({
+            type: "bi.multi_date_time_combo",
+            element: this
+        });
+        this.multiDateTime.on(BI.MultiDateTimeCombo.EVENT_CANCEL, function () {
+            self.fireEvent(BI.CustomMultiDateTimeCombo.EVENT_CANCEL);
+        });
+
+        this.multiDateTime.on(BI.MultiDateTimeCombo.EVENT_CONFIRM, function () {
+            self.fireEvent(BI.CustomMultiDateTimeCombo.EVENT_CONFIRM);
+        });
+    },
+
+    getValue: function () {
+        return this.multiDateTime.getValue();
+    },
+
+    setValue: function (v) {
+        this.multiDateTime.setValue(v);
+    }
+});
+BI.CustomMultiDateTimeCombo.EVENT_CHANGE = "EVENT_CHANGE";
+BI.CustomMultiDateTimeCombo.EVENT_CANCEL = "EVENT_CANCEL";
+BI.CustomMultiDateTimeCombo.EVENT_CONFIRM = "EVENT_CONFIRM";
+BI.shortcut("bi.custom_multi_date_time_combo", BI.CustomMultiDateTimeCombo);
+/**
+ * Created by Urthur on 2017/7/14.
+ */
+BI.MultiDateTimePopup = BI.inherit(BI.Widget, {
+    constants: {
+        tabHeight: 30,
+        tabWidth: 42,
+        titleHeight: 27,
+        itemHeight: 30,
+        triggerHeight: 24,
+        buttonWidth: 90,
+        buttonHeight: 25,
+        popupHeight: 290,
+        popupWidth: 270,
+        comboAdjustHeight: 1,
+        lgap: 2,
+        border: 1
+    },
+    _defaultConfig: function () {
+        return BI.extend(BI.MultiDateTimePopup.superclass._defaultConfig.apply(this, arguments), {
+            baseCls: 'bi-multi-date-time-popup',
+            width: 268,
+            height: 290
+        });
+    },
+    _init: function () {
+        BI.MultiDateTimePopup.superclass._init.apply(this, arguments);
+        var self = this, opts = this.options;
+        this.cancelButton = BI.createWidget({
+            type: 'bi.text_button',
+            forceCenter: true,
+            cls: 'bi-multidate-popup-button bi-border-top bi-border-right',
+            shadow: true,
+            text: BI.i18nText("BI-Basic_Cancel")
+        });
+        this.cancelButton.on(BI.TextButton.EVENT_CHANGE, function () {
+            self.fireEvent(BI.MultiDateTimePopup.BUTTON_CANCEL_EVENT_CHANGE);
+        });
+
+        this.okButton = BI.createWidget({
+            type: "bi.text_button",
+            forceCenter: true,
+            cls: 'bi-multidate-popup-button bi-border-top',
+            shadow: true,
+            text: BI.i18nText("BI-Basic_OK")
+        });
+        this.okButton.on(BI.TextButton.EVENT_CHANGE, function () {
+            self.fireEvent(BI.MultiDateTimePopup.BUTTON_OK_EVENT_CHANGE);
+        });
+
+        this.dateCombo = BI.createWidget({
+            type: "bi.date_calendar_popup",
+            min: self.options.min,
+            max: self.options.max
+        });
+        self.dateCombo.on(BI.DateCalendarPopup.EVENT_CHANGE, function () {
+            self.fireEvent(BI.MultiDateTimePopup.CALENDAR_EVENT_CHANGE);
+        });
+
+        this.dateSelect = BI.createWidget({
+            type: "bi.horizontal",
+            cls: "bi-border-top",
+            items: [{
+                type: "bi.label",
+                text: BI.i18nText("BI-Basic_Time"),
+                width: 45
+            },{
+                type: "bi.multi_date_time_select",
+                max: 23,
+                min: 0,
+                width: 60,
+                height: 30,
+                ref: function (_ref) {
+                    self.hour = _ref;
+                    self.hour.on(BI.MultiDateTimeSelect.EVENT_CONFIRM, function () {
+                        self.fireEvent(BI.MultiDateTimePopup.CALENDAR_EVENT_CHANGE);
+                    });
+                }
+            },{
+                type: "bi.label",
+                text: ":",
+                width: 15
+            },{
+                type: "bi.multi_date_time_select",
+                max: 59,
+                min: 0,
+                width: 60,
+                height: 30,
+                ref: function (_ref) {
+                    self.minute = _ref;
+                    self.minute.on(BI.MultiDateTimeSelect.EVENT_CONFIRM, function () {
+                        self.fireEvent(BI.MultiDateTimePopup.CALENDAR_EVENT_CHANGE);
+                    });
+                }
+            },{
+                type: "bi.label",
+                text: ":",
+                width: 15
+            },{
+                type: "bi.multi_date_time_select",
+                max: 59,
+                min: 0,
+                width: 60,
+                height: 30,
+                ref: function (_ref) {
+                    self.second = _ref;
+                    self.second.on(BI.MultiDateTimeSelect.EVENT_CONFIRM, function () {
+                        self.fireEvent(BI.MultiDateTimePopup.CALENDAR_EVENT_CHANGE);
+                    });
+                }
+            }]
+        });
+
+        this.dateButton = BI.createWidget({
+            type: "bi.grid",
+            items: [[this.cancelButton, this.okButton]]
+        });
+        BI.createWidget({
+            element: this,
+            type: "bi.vtape",
+            items: [{
+                el: this.dateCombo
+            }, {
+                el: this.dateSelect,
+                height: 50
+            },{
+                el: this.dateButton,
+                height: 30
+            }]
+        });
+    },
+
+    setValue: function (v) {
+        var value, date;
+        if (BI.isNotNull(v)) {
+            value = v.value;
+            if(BI.isNull(value)){
+                date = new Date();
+                this.dateCombo.setValue({
+                    year: date.getFullYear(),
+                    month: date.getMonth(),
+                    day: date.getDate()
+                });
+                this.hour.setValue(date.getHours());
+                this.minute.setValue(date.getMinutes());
+                this.second.setValue(date.getSeconds());
+            } else {
+                this.dateCombo.setValue({
+                    year: value.year,
+                    month: value.month,
+                    day: value.day
+                });
+                this.hour.setValue(value.hour);
+                this.minute.setValue(value.minute);
+                this.second.setValue(value.second);
+            }
+        }
+    },
+
+    getValue: function () {
+        return {
+            value: {
+                year: this.dateCombo.getValue().year,
+                month: this.dateCombo.getValue().month,
+                day: this.dateCombo.getValue().day,
+                hour: this.hour.getValue(),
+                minute: this.minute.getValue(),
+                second: this.second.getValue()
+            }
+        }
+    }
+});
+BI.MultiDateTimePopup.BUTTON_OK_EVENT_CHANGE = "BUTTON_OK_EVENT_CHANGE";
+BI.MultiDateTimePopup.BUTTON_CANCEL_EVENT_CHANGE = "BUTTON_CANCEL_EVENT_CHANGE";
+BI.MultiDateTimePopup.CALENDAR_EVENT_CHANGE = "CALENDAR_EVENT_CHANGE";
+BI.shortcut('bi.multi_date_time_popup', BI.MultiDateTimePopup);
+
+/**
+ * Created by Urthur on 2017/7/14.
+ */
+BI.MultiDateTimeSelect = BI.inherit(BI.Widget, {
+    _defaultConfig: function () {
+        return BI.extend(BI.MultiDateTimeSelect.superclass._defaultConfig.apply(this, arguments), {
+            baseCls: "bi-multi-date-time-select bi-border",
+            max: 23,
+            min: 0
+        })
+    },
+
+    _init: function () {
+        BI.MultiDateTimeSelect.superclass._init.apply(this, arguments);
+        var self = this, o = this.options;
+        this.editor = BI.createWidget({
+            type: "bi.sign_editor",
+            value: this._alertInEditorValue(o.min),
+            errorText: BI.i18nText("BI-Please_Input_Natural_Number"),
+            validationChecker: function(v){
+                return BI.isNaturalNumber(v);
+            }
+        });
+        this.editor.on(BI.TextEditor.EVENT_CONFIRM, function(){
+            self._finetuning(0);
+            self.fireEvent(BI.MultiDateTimeSelect.EVENT_CONFIRM);
+        });
+        this.topBtn = BI.createWidget({
+            type: "bi.icon_button",
+            cls: "column-pre-page-h-font top-button bi-border-left bi-border-bottom"
+        });
+        this.topBtn.on(BI.IconButton.EVENT_CHANGE, function(){
+            self._finetuning(1);
+            self.fireEvent(BI.MultiDateTimeSelect.EVENT_CONFIRM);
+        });
+        this.bottomBtn = BI.createWidget({
+            type: "bi.icon_button",
+            cls: "column-next-page-h-font bottom-button bi-border-left"
+        });
+        this.bottomBtn.on(BI.IconButton.EVENT_CHANGE, function(){
+            self._finetuning(-1);
+            self.fireEvent(BI.MultiDateTimeSelect.EVENT_CONFIRM);
+        });
+        this._finetuning(0);
+        BI.createWidget({
+            type: "bi.htape",
+            element: this,
+            items: [this.editor, {
+                el: {
+                    type: "bi.grid",
+                    columns: 1,
+                    rows: 2,
+                    items: [{
+                        column: 0,
+                        row: 0,
+                        el: this.topBtn
+                    }, {
+                        column: 0,
+                        row: 1,
+                        el: this.bottomBtn
+                    }]
+                },
+                width: 30
+            }]
+        });
+    },
+
+    _alertOutEditorValue: function(v){
+        if (v > this.options.max){
+            v = this.options.min;
+        }
+        if (v < this.options.min){
+            v = this.options.max
+        }
+        return BI.parseInt(v);
+    },
+
+    _alertInEditorValue: function(v){
+        if (v > this.options.max){
+            v = this.options.min;
+        }
+        if (v < this.options.min){
+            v = this.options.max;
+        }
+        v = v < 10 ? "0" + v : v;
+        return v;
+    },
+
+    _finetuning: function(add){
+        var v = BI.parseInt(this._alertOutEditorValue(this.editor.getValue()));
+        this.editor.setValue(this._alertInEditorValue(v + add));
+    },
+
+    getValue: function () {
+        var v = this.editor.getValue();
+        return this._alertOutEditorValue(v);
+    },
+
+    setValue: function (v) {
+        this.editor.setValue(this._alertInEditorValue(v));
+        this._finetuning(0);
+    }
+
+});
+BI.MultiDateTimeSelect.EVENT_CONFIRM = "EVENT_CONFIRM";
+BI.shortcut("bi.multi_date_time_select", BI.MultiDateTimeSelect);
+/**
+ * Created by Urthur on 2017/7/14.
+ */
+BI.DateTimeTrigger = BI.inherit(BI.Trigger, {
+    _const: {
+        hgap: 4,
+        vgap: 2,
+        triggerWidth: 30
+    },
+
+    _defaultConfig: function () {
+        return BI.extend(BI.DateTimeTrigger.superclass._defaultConfig.apply(this, arguments), {
+            extraCls: "bi-date-time-trigger",
+            min: '1900-01-01', //最小日期
+            max: '2099-12-31', //最大日期
+            height: 25
+        });
+    },
+    _init: function () {
+        BI.DateTimeTrigger.superclass._init.apply(this, arguments);
+        var self = this, o = this.options, c = this._const;
+        this.editor = BI.createWidget({
+            type: "bi.sign_editor",
+            height: o.height,
+            hgap: c.hgap,
+            vgap: c.vgap,
+            disabled: true
+        });
+
+        BI.createWidget({
+            type: "bi.htape",
+            element: this,
+            items: [{
+                el: BI.createWidget(),
+                width: 30
+            }, {
+                el: this.editor
+            }]
+        })
+    },
+
+    _printTime: function (v) {
+        return v < 10 ? "0" + v : v;
+    },
+
+    setValue: function (v) {
+        var self = this;
+        if (BI.isNotNull(v)) {
+            var value = v.value, dateStr;
+            if(BI.isNull(value)){
+                value = new Date();
+                dateStr = value.getFullYear() + "-" + self._printTime(value.getMonth() + 1) + "-" + self._printTime(value.getDate())
+                    + " " + self._printTime(value.getHours()) + ":" + self._printTime(value.getMinutes()) + ":" + self._printTime(value.getSeconds());
+            } else {
+                dateStr = value.year + "-" + self._printTime(value.month + 1) + "-" + self._printTime(value.day)
+                    + " " + self._printTime(value.hour) + ":" + self._printTime(value.minute) + ":" + self._printTime(value.second);
+            }
+            this.editor.setValue(dateStr);
+        }
+    }
+
+});
+BI.shortcut("bi.date_time_trigger", BI.DateTimeTrigger);
+/**
  * Created by User on 2017/3/22.
  */
 Demo.MultiSelectCombo = BI.inherit(BI.Widget, {

src/base/single/icon/icon.js

@@ -13,6 +13,9 @@ BI.Icon = BI.inherit(BI.Single, {
     },
     _init: function () {
         BI.Icon.superclass._init.apply(this, arguments);
+        if (BI.isIE9Below()) {
+            this.element.addClass("hack");
+        }
     }
 });
 BI.shortcut("bi.icon", BI.Icon);

src/css/resource/font.css

@@ -12,7 +12,7 @@
   -moz-osx-font-smoothing: grayscale;
 }
 .close-font .b-font {
-  *zoom: expression( this.runtimeStyle['zoom'] = '1',this.innerHTML = '&#xe600');
+  *zoom: expression( this.runtimeStyle['zoom'] = '1',this.innerHTML = '');
 }
 .close-font .b-font:before {
   content: "\e600";
@@ -24,7 +24,7 @@
   color: inherit;
 }
 .close-h-font .b-font {
-  *zoom: expression( this.runtimeStyle['zoom'] = '1',this.innerHTML = '&#xe600');
+  *zoom: expression( this.runtimeStyle['zoom'] = '1',this.innerHTML = '');
 }
 .close-h-font .b-font:before {
   content: "\e600";
@@ -42,7 +42,7 @@
   color: inherit;
 }
 .close-ha-font .b-font {
-  *zoom: expression( this.runtimeStyle['zoom'] = '1',this.innerHTML = '&#xe600');
+  *zoom: expression( this.runtimeStyle['zoom'] = '1',this.innerHTML = '');
 }
 .close-ha-font .b-font:before {
   content: "\e600";
@@ -65,7 +65,7 @@
   color: inherit;
 }
 .search-close-h-font .b-font {
-  *zoom: expression( this.runtimeStyle['zoom'] = '1',this.innerHTML = '&#xe600');
+  *zoom: expression( this.runtimeStyle['zoom'] = '1',this.innerHTML = '');
 }
 .search-close-h-font .b-font:before {
   content: "\e600";
@@ -83,7 +83,7 @@
   color: inherit;
 }
 .pre-page-h-font .b-font {
-  *zoom: expression( this.runtimeStyle['zoom'] = '1',this.innerHTML = '&#xe601');
+  *zoom: expression( this.runtimeStyle['zoom'] = '1',this.innerHTML = '');
 }
 .pre-page-h-font .b-font:before {
   content: "\e601";
@@ -101,7 +101,7 @@
   color: inherit;
 }
 .next-page-h-font .b-font {
-  *zoom: expression( this.runtimeStyle['zoom'] = '1',this.innerHTML = '&#xe602');
+  *zoom: expression( this.runtimeStyle['zoom'] = '1',this.innerHTML = '');
 }
 .next-page-h-font .b-font:before {
   content: "\e602";
@@ -119,7 +119,7 @@
   color: inherit;
 }
 .search-font .b-font {
-  *zoom: expression( this.runtimeStyle['zoom'] = '1',this.innerHTML = '&#xe604');
+  *zoom: expression( this.runtimeStyle['zoom'] = '1',this.innerHTML = '');
 }
 .search-font .b-font:before {
   content: "\e604";
@@ -131,7 +131,7 @@
   color: inherit;
 }
 .dot-font .b-font {
-  *zoom: expression( this.runtimeStyle['zoom'] = '1',this.innerHTML = '&#xe606');
+  *zoom: expression( this.runtimeStyle['zoom'] = '1',this.innerHTML = '');
 }
 .dot-font .b-font:before {
   content: "\e606";
@@ -143,7 +143,7 @@
   color: #1a1a1a;
 }
 .dot-h-font .b-font {
-  *zoom: expression( this.runtimeStyle['zoom'] = '1',this.innerHTML = '&#xe606');
+  *zoom: expression( this.runtimeStyle['zoom'] = '1',this.innerHTML = '');
 }
 .dot-h-font .b-font:before {
   content: "\e606";
@@ -161,7 +161,7 @@
   color: #1a1a1a;
 }
 .dot-ha-font .b-font {
-  *zoom: expression( this.runtimeStyle['zoom'] = '1',this.innerHTML = '&#xe606');
+  *zoom: expression( this.runtimeStyle['zoom'] = '1',this.innerHTML = '');
 }
 .dot-ha-font .b-font:before {
   content: "\e606";
@@ -184,7 +184,7 @@
   color: #ffffff;
 }
 .dot-e-font .b-font {
-  *zoom: expression( this.runtimeStyle['zoom'] = '1',this.innerHTML = '&#xe606');
+  *zoom: expression( this.runtimeStyle['zoom'] = '1',this.innerHTML = '');
 }
 .dot-e-font .b-font:before {
   content: "\e606";
@@ -210,7 +210,7 @@
   color: #ffffff;
 }
 .pull-right-font .b-font {
-  *zoom: expression( this.runtimeStyle['zoom'] = '1',this.innerHTML = '&#xe607');
+  *zoom: expression( this.runtimeStyle['zoom'] = '1',this.innerHTML = '');
 }
 .pull-right-font .b-font:before {
   content: "\e607";
@@ -222,7 +222,7 @@
   color: inherit;
 }
 .pull-right-h-font .b-font {
-  *zoom: expression( this.runtimeStyle['zoom'] = '1',this.innerHTML = '&#xe607');
+  *zoom: expression( this.runtimeStyle['zoom'] = '1',this.innerHTML = '');
 }
 .pull-right-h-font .b-font:before {
   content: "\e607";
@@ -240,7 +240,7 @@
   color: inherit;
 }
 .pull-right-ha-font .b-font {
-  *zoom: expression( this.runtimeStyle['zoom'] = '1',this.innerHTML = '&#xe607');
+  *zoom: expression( this.runtimeStyle['zoom'] = '1',this.innerHTML = '');
 }
 .pull-right-ha-font .b-font:before {
   content: "\e607";
@@ -263,7 +263,7 @@
   color: inherit;
 }
 .pull-right-e-font .b-font {
-  *zoom: expression( this.runtimeStyle['zoom'] = '1',this.innerHTML = '&#xe607');
+  *zoom: expression( this.runtimeStyle['zoom'] = '1',this.innerHTML = '');
 }
 .pull-right-e-font .b-font:before {
   content: "\e607";
@@ -289,7 +289,7 @@
   color: inherit;
 }
 .copy-font .b-font {
-  *zoom: expression( this.runtimeStyle['zoom'] = '1',this.innerHTML = '&#xe610');
+  *zoom: expression( this.runtimeStyle['zoom'] = '1',this.innerHTML = '');
 }
 .copy-font .b-font:before {
   content: "\e610";
@@ -301,7 +301,7 @@
   color: inherit;
 }
 .copy-h-font .b-font {
-  *zoom: expression( this.runtimeStyle['zoom'] = '1',this.innerHTML = '&#xe610');
+  *zoom: expression( this.runtimeStyle['zoom'] = '1',this.innerHTML = '');
 }
 .copy-h-font .b-font:before {
   content: "\e610";
@@ -319,7 +319,7 @@
   color: #1a1a1a;
 }
 .copy-ha-font .b-font {
-  *zoom: expression( this.runtimeStyle['zoom'] = '1',this.innerHTML = '&#xe610');
+  *zoom: expression( this.runtimeStyle['zoom'] = '1',this.innerHTML = '');
 }
 .copy-ha-font .b-font:before {
   content: "\e610";
@@ -342,7 +342,7 @@
   color: inherit;
 }
 .copy-e-font .b-font {
-  *zoom: expression( this.runtimeStyle['zoom'] = '1',this.innerHTML = '&#xe610');
+  *zoom: expression( this.runtimeStyle['zoom'] = '1',this.innerHTML = '');
 }
 .copy-e-font .b-font:before {
   content: "\e610";
@@ -368,7 +368,7 @@
   color: inherit;
 }
 .check-mark-font .b-font {
-  *zoom: expression( this.runtimeStyle['zoom'] = '1',this.innerHTML = '&#xe611');
+  *zoom: expression( this.runtimeStyle['zoom'] = '1',this.innerHTML = '');
 }
 .check-mark-font .b-font:before {
   content: "\e611";
@@ -380,7 +380,7 @@
   color: inherit;
 }
 .check-mark-h-font .b-font {
-  *zoom: expression( this.runtimeStyle['zoom'] = '1',this.innerHTML = '&#xe611');
+  *zoom: expression( this.runtimeStyle['zoom'] = '1',this.innerHTML = '');
 }
 .check-mark-h-font .b-font:before {
   content: "\e611";
@@ -398,7 +398,7 @@
   color: inherit;
 }
 .check-mark-ha-font .b-font {
-  *zoom: expression( this.runtimeStyle['zoom'] = '1',this.innerHTML = '&#xe611');
+  *zoom: expression( this.runtimeStyle['zoom'] = '1',this.innerHTML = '');
 }
 .check-mark-ha-font .b-font:before {
   content: "\e611";
@@ -421,7 +421,7 @@
   color: inherit;
 }
 .check-mark-e-font .b-font {
-  *zoom: expression( this.runtimeStyle['zoom'] = '1',this.innerHTML = '&#xe611');
+  *zoom: expression( this.runtimeStyle['zoom'] = '1',this.innerHTML = '');
 }
 .check-mark-e-font .b-font:before {
   content: "\e611";
@@ -448,7 +448,7 @@
 }
 /** dashboard组件/控件 下拉列表图标字体 ~end~**/
 .tree-node-triangle-expand-font .b-font {
-  *zoom: expression( this.runtimeStyle['zoom'] = '1',this.innerHTML = '&#xe608');
+  *zoom: expression( this.runtimeStyle['zoom'] = '1',this.innerHTML = '');
 }
 .tree-node-triangle-expand-font .b-font:before {
   content: "\e608";
@@ -460,7 +460,7 @@
   color: inherit;
 }
 .tree-node-triangle-collapse-font .b-font {
-  *zoom: expression( this.runtimeStyle['zoom'] = '1',this.innerHTML = '&#xe607');
+  *zoom: expression( this.runtimeStyle['zoom'] = '1',this.innerHTML = '');
 }
 .tree-node-triangle-collapse-font .b-font:before {
   content: "\e607";
@@ -472,7 +472,7 @@
   color: inherit;
 }
 .row-pre-page-h-font .b-font {
-  *zoom: expression( this.runtimeStyle['zoom'] = '1',this.innerHTML = '&#xe6be');
+  *zoom: expression( this.runtimeStyle['zoom'] = '1',this.innerHTML = '');
 }
 .row-pre-page-h-font .b-font:before {
   content: "\e6be";
@@ -490,7 +490,7 @@
   color: inherit;
 }
 .row-next-page-h-font .b-font {
-  *zoom: expression( this.runtimeStyle['zoom'] = '1',this.innerHTML = '&#xe6bd');
+  *zoom: expression( this.runtimeStyle['zoom'] = '1',this.innerHTML = '');
 }
 .row-next-page-h-font .b-font:before {
   content: "\e6bd";
@@ -508,7 +508,7 @@
   color: inherit;
 }
 .column-pre-page-h-font .b-font {
-  *zoom: expression( this.runtimeStyle['zoom'] = '1',this.innerHTML = '&#xe6bc');
+  *zoom: expression( this.runtimeStyle['zoom'] = '1',this.innerHTML = '');
 }
 .column-pre-page-h-font .b-font:before {
   content: "\e6bc";
@@ -526,7 +526,7 @@
   color: inherit;
 }
 .column-next-page-h-font .b-font {
-  *zoom: expression( this.runtimeStyle['zoom'] = '1',this.innerHTML = '&#xe6bb');
+  *zoom: expression( this.runtimeStyle['zoom'] = '1',this.innerHTML = '');
 }
 .column-next-page-h-font .b-font:before {
   content: "\e6bb";
@@ -544,7 +544,7 @@
   color: inherit;
 }
 .trigger-triangle-font .b-font {
-  *zoom: expression( this.runtimeStyle['zoom'] = '1',this.innerHTML = '&#xe66a');
+  *zoom: expression( this.runtimeStyle['zoom'] = '1',this.innerHTML = '');
 }
 .trigger-triangle-font .b-font:before {
   content: "\e66a";
@@ -567,7 +567,7 @@
   color: #999999;
 }
 .pull-down-font .b-font {
-  *zoom: expression( this.runtimeStyle['zoom'] = '1',this.innerHTML = '&#xe608');
+  *zoom: expression( this.runtimeStyle['zoom'] = '1',this.innerHTML = '');
 }
 .pull-down-font .b-font:before {
   content: "\e608";
@@ -579,7 +579,7 @@
   color: inherit;
 }
 .pull-down-h-font .b-font {
-  *zoom: expression( this.runtimeStyle['zoom'] = '1',this.innerHTML = '&#xe608');
+  *zoom: expression( this.runtimeStyle['zoom'] = '1',this.innerHTML = '');
 }
 .pull-down-h-font .b-font:before {
   content: "\e608";
@@ -597,7 +597,7 @@
   color: inherit;
 }
 .pull-down-ha-font .b-font {
-  *zoom: expression( this.runtimeStyle['zoom'] = '1',this.innerHTML = '&#xe608');
+  *zoom: expression( this.runtimeStyle['zoom'] = '1',this.innerHTML = '');
 }
 .pull-down-ha-font .b-font:before {
   content: "\e608";
@@ -620,7 +620,7 @@
   color: inherit;
 }
 .check-font .b-font {
-  *zoom: expression( this.runtimeStyle['zoom'] = '1',this.innerHTML = '&#xe611');
+  *zoom: expression( this.runtimeStyle['zoom'] = '1',this.innerHTML = '');
 }
 .check-font .b-font:before {
   content: "\e611";
@@ -632,7 +632,7 @@
   color: #3f8ce8;
 }
 .item-check-font .b-font {
-  *zoom: expression( this.runtimeStyle['zoom'] = '1',this.innerHTML = '&#xe611');
+  *zoom: expression( this.runtimeStyle['zoom'] = '1',this.innerHTML = '');
 }
 .item-check-font .b-font:before {
   content: "\e611";
@@ -655,7 +655,7 @@
   color: #ffffff;
 }
 .primary-key-font .b-font {
-  *zoom: expression( this.runtimeStyle['zoom'] = '1',this.innerHTML = '');
+  *zoom: expression( this.runtimeStyle['zoom'] = '1',this.innerHTML = ';');
 }
 .primary-key-font .b-font:before {
   content: "\e67d;";
@@ -673,7 +673,7 @@
   color: inherit;
 }
 .drag-tag-font .b-font {
-  *zoom: expression( this.runtimeStyle['zoom'] = '1',this.innerHTML = '&#xe600');
+  *zoom: expression( this.runtimeStyle['zoom'] = '1',this.innerHTML = '');
 }
 .drag-tag-font .b-font:before {
   content: "\e600";
@@ -684,16 +684,3 @@
   content: "\e600";
   color: #f07d0a;
 }
-
-.chart-date-normal-font .b-font {
-  *zoom: expression( this.runtimeStyle['zoom'] = '1',this.innerHTML = '');
-}
-.chart-date-normal-font .b-font:before {
-  content: "\e61b";
-  color: inherit;
-}
-.chart-date-normal-font.native .b-font:before,
-.chart-date-normal-font.disabled .b-font:before {
-  content: "\e61b";
-  color: inherit;
-}

src/css/resource/icon.css

@@ -6,6 +6,13 @@
   _filter: progid:DXImageTransform.Microsoft.AlphaImageLoader(src='icon/tree-collapse-1.png');
   _background: none;
 }
+.tree-collapse-icon-type1 .x-icon.hack,
+.tree-collapse-icon-type1:hover .x-icon.hack,
+.tree-collapse-icon-type1:active .x-icon.hack {
+  background: url('icon/tree-collapse-1.png') no-repeat 0px 0px;
+  _filter: progid:DXImageTransform.Microsoft.AlphaImageLoader(src='icon/tree-collapse-1.png');
+  _background: none;
+}
 .tree-collapse-icon-type1.native .x-icon,
 .tree-collapse-icon-type1.disabled .x-icon {
   display: block;
@@ -13,6 +20,12 @@
   _filter: progid:DXImageTransform.Microsoft.AlphaImageLoader(src='icon/tree-collapse-1.png');
   _background: none;
 }
+.tree-collapse-icon-type1.native .x-icon.hack,
+.tree-collapse-icon-type1.disabled .x-icon.hack {
+  background: url('icon/tree-collapse-1.png') no-repeat 0px 0px;
+  _filter: progid:DXImageTransform.Microsoft.AlphaImageLoader(src='icon/tree-collapse-1.png');
+  _background: none;
+}
 .tree-collapse-icon-type2 .x-icon,
 .tree-collapse-icon-type2:hover .x-icon,
 .tree-collapse-icon-type2:active .x-icon {
@@ -21,6 +34,13 @@
   _filter: progid:DXImageTransform.Microsoft.AlphaImageLoader(src='icon/tree-collapse-2.png');
   _background: none;
 }
+.tree-collapse-icon-type2 .x-icon.hack,
+.tree-collapse-icon-type2:hover .x-icon.hack,
+.tree-collapse-icon-type2:active .x-icon.hack {
+  background: url('icon/tree-collapse-2.png') no-repeat 0px 0px;
+  _filter: progid:DXImageTransform.Microsoft.AlphaImageLoader(src='icon/tree-collapse-2.png');
+  _background: none;
+}
 .tree-collapse-icon-type2.native .x-icon,
 .tree-collapse-icon-type2.disabled .x-icon {
   display: block;
@@ -28,6 +48,12 @@
   _filter: progid:DXImageTransform.Microsoft.AlphaImageLoader(src='icon/tree-collapse-2.png');
   _background: none;
 }
+.tree-collapse-icon-type2.native .x-icon.hack,
+.tree-collapse-icon-type2.disabled .x-icon.hack {
+  background: url('icon/tree-collapse-2.png') no-repeat 0px 0px;
+  _filter: progid:DXImageTransform.Microsoft.AlphaImageLoader(src='icon/tree-collapse-2.png');
+  _background: none;
+}
 .tree-collapse-icon-type3 .x-icon,
 .tree-collapse-icon-type3:hover .x-icon,
 .tree-collapse-icon-type3:active .x-icon {
@@ -36,6 +62,13 @@
   _filter: progid:DXImageTransform.Microsoft.AlphaImageLoader(src='icon/tree-collapse-3.png');
   _background: none;
 }
+.tree-collapse-icon-type3 .x-icon.hack,
+.tree-collapse-icon-type3:hover .x-icon.hack,
+.tree-collapse-icon-type3:active .x-icon.hack {
+  background: url('icon/tree-collapse-3.png') no-repeat 0px 0px;
+  _filter: progid:DXImageTransform.Microsoft.AlphaImageLoader(src='icon/tree-collapse-3.png');
+  _background: none;
+}
 .tree-collapse-icon-type3.native .x-icon,
 .tree-collapse-icon-type3.disabled .x-icon {
   display: block;
@@ -43,6 +76,12 @@
   _filter: progid:DXImageTransform.Microsoft.AlphaImageLoader(src='icon/tree-collapse-3.png');
   _background: none;
 }
+.tree-collapse-icon-type3.native .x-icon.hack,
+.tree-collapse-icon-type3.disabled .x-icon.hack {
+  background: url('icon/tree-collapse-3.png') no-repeat 0px 0px;
+  _filter: progid:DXImageTransform.Microsoft.AlphaImageLoader(src='icon/tree-collapse-3.png');
+  _background: none;
+}
 .tree-collapse-icon-type4 .x-icon,
 .tree-collapse-icon-type4:hover .x-icon,
 .tree-collapse-icon-type4:active .x-icon {
@@ -51,6 +90,13 @@
   _filter: progid:DXImageTransform.Microsoft.AlphaImageLoader(src='icon/tree-collapse-4.png');
   _background: none;
 }
+.tree-collapse-icon-type4 .x-icon.hack,
+.tree-collapse-icon-type4:hover .x-icon.hack,
+.tree-collapse-icon-type4:active .x-icon.hack {
+  background: url('icon/tree-collapse-4.png') no-repeat 0px 0px;
+  _filter: progid:DXImageTransform.Microsoft.AlphaImageLoader(src='icon/tree-collapse-4.png');
+  _background: none;
+}
 .tree-collapse-icon-type4.native .x-icon,
 .tree-collapse-icon-type4.disabled .x-icon {
   display: block;
@@ -58,6 +104,12 @@
   _filter: progid:DXImageTransform.Microsoft.AlphaImageLoader(src='icon/tree-collapse-4.png');
   _background: none;
 }
+.tree-collapse-icon-type4.native .x-icon.hack,
+.tree-collapse-icon-type4.disabled .x-icon.hack {
+  background: url('icon/tree-collapse-4.png') no-repeat 0px 0px;
+  _filter: progid:DXImageTransform.Microsoft.AlphaImageLoader(src='icon/tree-collapse-4.png');
+  _background: none;
+}
 .tree-expand-icon-type1 .x-icon,
 .tree-expand-icon-type1:hover .x-icon,
 .tree-expand-icon-type1:active .x-icon {
@@ -66,6 +118,13 @@
   _filter: progid:DXImageTransform.Microsoft.AlphaImageLoader(src='icon/tree-expand-1.png');
   _background: none;
 }
+.tree-expand-icon-type1 .x-icon.hack,
+.tree-expand-icon-type1:hover .x-icon.hack,
+.tree-expand-icon-type1:active .x-icon.hack {
+  background: url('icon/tree-expand-1.png') no-repeat 0px 0px;
+  _filter: progid:DXImageTransform.Microsoft.AlphaImageLoader(src='icon/tree-expand-1.png');
+  _background: none;
+}
 .tree-expand-icon-type1.native .x-icon,
 .tree-expand-icon-type1.disabled .x-icon {
   display: block;
@@ -73,6 +132,12 @@
   _filter: progid:DXImageTransform.Microsoft.AlphaImageLoader(src='icon/tree-expand-1.png');
   _background: none;
 }
+.tree-expand-icon-type1.native .x-icon.hack,
+.tree-expand-icon-type1.disabled .x-icon.hack {
+  background: url('icon/tree-expand-1.png') no-repeat 0px 0px;
+  _filter: progid:DXImageTransform.Microsoft.AlphaImageLoader(src='icon/tree-expand-1.png');
+  _background: none;
+}
 .tree-expand-icon-type2 .x-icon,
 .tree-expand-icon-type2:hover .x-icon,
 .tree-expand-icon-type2:active .x-icon {
@@ -81,6 +146,13 @@
   _filter: progid:DXImageTransform.Microsoft.AlphaImageLoader(src='icon/tree-expand-2.png');
   _background: none;
 }
+.tree-expand-icon-type2 .x-icon.hack,
+.tree-expand-icon-type2:hover .x-icon.hack,
+.tree-expand-icon-type2:active .x-icon.hack {
+  background: url('icon/tree-expand-2.png') no-repeat 0px 0px;
+  _filter: progid:DXImageTransform.Microsoft.AlphaImageLoader(src='icon/tree-expand-2.png');
+  _background: none;
+}
 .tree-expand-icon-type2.native .x-icon,
 .tree-expand-icon-type2.disabled .x-icon {
   display: block;
@@ -88,6 +160,12 @@
   _filter: progid:DXImageTransform.Microsoft.AlphaImageLoader(src='icon/tree-expand-2.png');
   _background: none;
 }
+.tree-expand-icon-type2.native .x-icon.hack,
+.tree-expand-icon-type2.disabled .x-icon.hack {
+  background: url('icon/tree-expand-2.png') no-repeat 0px 0px;
+  _filter: progid:DXImageTransform.Microsoft.AlphaImageLoader(src='icon/tree-expand-2.png');
+  _background: none;
+}
 .tree-expand-icon-type3 .x-icon,
 .tree-expand-icon-type3:hover .x-icon,
 .tree-expand-icon-type3:active .x-icon {
@@ -96,6 +174,13 @@
   _filter: progid:DXImageTransform.Microsoft.AlphaImageLoader(src='icon/tree-expand-3.png');
   _background: none;
 }
+.tree-expand-icon-type3 .x-icon.hack,
+.tree-expand-icon-type3:hover .x-icon.hack,
+.tree-expand-icon-type3:active .x-icon.hack {
+  background: url('icon/tree-expand-3.png') no-repeat 0px 0px;
+  _filter: progid:DXImageTransform.Microsoft.AlphaImageLoader(src='icon/tree-expand-3.png');
+  _background: none;
+}
 .tree-expand-icon-type3.native .x-icon,
 .tree-expand-icon-type3.disabled .x-icon {
   display: block;
@@ -103,6 +188,12 @@
   _filter: progid:DXImageTransform.Microsoft.AlphaImageLoader(src='icon/tree-expand-3.png');
   _background: none;
 }
+.tree-expand-icon-type3.native .x-icon.hack,
+.tree-expand-icon-type3.disabled .x-icon.hack {
+  background: url('icon/tree-expand-3.png') no-repeat 0px 0px;
+  _filter: progid:DXImageTransform.Microsoft.AlphaImageLoader(src='icon/tree-expand-3.png');
+  _background: none;
+}
 .tree-expand-icon-type4 .x-icon,
 .tree-expand-icon-type4:hover .x-icon,
 .tree-expand-icon-type4:active .x-icon {
@@ -111,6 +202,13 @@
   _filter: progid:DXImageTransform.Microsoft.AlphaImageLoader(src='icon/tree-expand-4.png');
   _background: none;
 }
+.tree-expand-icon-type4 .x-icon.hack,
+.tree-expand-icon-type4:hover .x-icon.hack,
+.tree-expand-icon-type4:active .x-icon.hack {
+  background: url('icon/tree-expand-4.png') no-repeat 0px 0px;
+  _filter: progid:DXImageTransform.Microsoft.AlphaImageLoader(src='icon/tree-expand-4.png');
+  _background: none;
+}
 .tree-expand-icon-type4.native .x-icon,
 .tree-expand-icon-type4.disabled .x-icon {
   display: block;
@@ -118,6 +216,12 @@
   _filter: progid:DXImageTransform.Microsoft.AlphaImageLoader(src='icon/tree-expand-4.png');
   _background: none;
 }
+.tree-expand-icon-type4.native .x-icon.hack,
+.tree-expand-icon-type4.disabled .x-icon.hack {
+  background: url('icon/tree-expand-4.png') no-repeat 0px 0px;
+  _filter: progid:DXImageTransform.Microsoft.AlphaImageLoader(src='icon/tree-expand-4.png');
+  _background: none;
+}
 .tree-vertical-line-type2 .x-icon,
 .tree-vertical-line-type2:hover .x-icon,
 .tree-vertical-line-type2:active .x-icon {
@@ -126,6 +230,13 @@
   _filter: progid:DXImageTransform.Microsoft.AlphaImageLoader(src='icon/tree-vertical-line-2.png');
   _background: none;
 }
+.tree-vertical-line-type2 .x-icon.hack,
+.tree-vertical-line-type2:hover .x-icon.hack,
+.tree-vertical-line-type2:active .x-icon.hack {
+  background: url('icon/tree-vertical-line-2.png') no-repeat 0px 0px;
+  _filter: progid:DXImageTransform.Microsoft.AlphaImageLoader(src='icon/tree-vertical-line-2.png');
+  _background: none;
+}
 .tree-vertical-line-type2.native .x-icon,
 .tree-vertical-line-type2.disabled .x-icon {
   display: block;
@@ -133,6 +244,12 @@
   _filter: progid:DXImageTransform.Microsoft.AlphaImageLoader(src='icon/tree-vertical-line-2.png');
   _background: none;
 }
+.tree-vertical-line-type2.native .x-icon.hack,
+.tree-vertical-line-type2.disabled .x-icon.hack {
+  background: url('icon/tree-vertical-line-2.png') no-repeat 0px 0px;
+  _filter: progid:DXImageTransform.Microsoft.AlphaImageLoader(src='icon/tree-vertical-line-2.png');
+  _background: none;
+}
 .tree-vertical-line-type3 .x-icon,
 .tree-vertical-line-type3:hover .x-icon,
 .tree-vertical-line-type3:active .x-icon {
@@ -141,6 +258,13 @@
   _filter: progid:DXImageTransform.Microsoft.AlphaImageLoader(src='icon/tree-vertical-line-3.png');
   _background: none;
 }
+.tree-vertical-line-type3 .x-icon.hack,
+.tree-vertical-line-type3:hover .x-icon.hack,
+.tree-vertical-line-type3:active .x-icon.hack {
+  background: url('icon/tree-vertical-line-3.png') no-repeat 0px 0px;
+  _filter: progid:DXImageTransform.Microsoft.AlphaImageLoader(src='icon/tree-vertical-line-3.png');
+  _background: none;
+}
 .tree-vertical-line-type3.native .x-icon,
 .tree-vertical-line-type3.disabled .x-icon {
   display: block;
@@ -148,6 +272,12 @@
   _filter: progid:DXImageTransform.Microsoft.AlphaImageLoader(src='icon/tree-vertical-line-3.png');
   _background: none;
 }
+.tree-vertical-line-type3.native .x-icon.hack,
+.tree-vertical-line-type3.disabled .x-icon.hack {
+  background: url('icon/tree-vertical-line-3.png') no-repeat 0px 0px;
+  _filter: progid:DXImageTransform.Microsoft.AlphaImageLoader(src='icon/tree-vertical-line-3.png');
+  _background: none;
+}
 .tree-vertical-line-type4 .x-icon,
 .tree-vertical-line-type4:hover .x-icon,
 .tree-vertical-line-type4:active .x-icon {
@@ -156,6 +286,13 @@
   _filter: progid:DXImageTransform.Microsoft.AlphaImageLoader(src='icon/tree-vertical-line-4.png');
   _background: none;
 }
+.tree-vertical-line-type4 .x-icon.hack,
+.tree-vertical-line-type4:hover .x-icon.hack,
+.tree-vertical-line-type4:active .x-icon.hack {
+  background: url('icon/tree-vertical-line-4.png') no-repeat 0px 0px;
+  _filter: progid:DXImageTransform.Microsoft.AlphaImageLoader(src='icon/tree-vertical-line-4.png');
+  _background: none;
+}
 .tree-vertical-line-type4.native .x-icon,
 .tree-vertical-line-type4.disabled .x-icon {
   display: block;
@@ -163,6 +300,12 @@
   _filter: progid:DXImageTransform.Microsoft.AlphaImageLoader(src='icon/tree-vertical-line-4.png');
   _background: none;
 }
+.tree-vertical-line-type4.native .x-icon.hack,
+.tree-vertical-line-type4.disabled .x-icon.hack {
+  background: url('icon/tree-vertical-line-4.png') no-repeat 0px 0px;
+  _filter: progid:DXImageTransform.Microsoft.AlphaImageLoader(src='icon/tree-vertical-line-4.png');
+  _background: none;
+}
 .bi-theme-dark .tree-collapse-icon-type1 .x-icon,
 .bi-theme-dark .tree-collapse-icon-type1:hover .x-icon,
 .bi-theme-dark .tree-collapse-icon-type1:active .x-icon {
@@ -171,6 +314,13 @@
   _filter: progid:DXImageTransform.Microsoft.AlphaImageLoader(src='icon/dark/tree-collapse-1.png');
   _background: none;
 }
+.bi-theme-dark .tree-collapse-icon-type1 .x-icon.hack,
+.bi-theme-dark .tree-collapse-icon-type1:hover .x-icon.hack,
+.bi-theme-dark .tree-collapse-icon-type1:active .x-icon.hack {
+  background: url('icon/dark/tree-collapse-1.png') no-repeat 0px 0px;
+  _filter: progid:DXImageTransform.Microsoft.AlphaImageLoader(src='icon/dark/tree-collapse-1.png');
+  _background: none;
+}
 .bi-theme-dark .tree-collapse-icon-type1.native .x-icon,
 .bi-theme-dark .tree-collapse-icon-type1.disabled .x-icon {
   display: block;
@@ -178,6 +328,12 @@
   _filter: progid:DXImageTransform.Microsoft.AlphaImageLoader(src='icon/dark/tree-collapse-1.png');
   _background: none;
 }
+.bi-theme-dark .tree-collapse-icon-type1.native .x-icon.hack,
+.bi-theme-dark .tree-collapse-icon-type1.disabled .x-icon.hack {
+  background: url('icon/dark/tree-collapse-1.png') no-repeat 0px 0px;
+  _filter: progid:DXImageTransform.Microsoft.AlphaImageLoader(src='icon/dark/tree-collapse-1.png');
+  _background: none;
+}
 .bi-theme-dark .tree-collapse-icon-type2 .x-icon,
 .bi-theme-dark .tree-collapse-icon-type2:hover .x-icon,
 .bi-theme-dark .tree-collapse-icon-type2:active .x-icon {
@@ -186,6 +342,13 @@
   _filter: progid:DXImageTransform.Microsoft.AlphaImageLoader(src='icon/dark/tree-collapse-2.png');
   _background: none;
 }
+.bi-theme-dark .tree-collapse-icon-type2 .x-icon.hack,
+.bi-theme-dark .tree-collapse-icon-type2:hover .x-icon.hack,
+.bi-theme-dark .tree-collapse-icon-type2:active .x-icon.hack {
+  background: url('icon/dark/tree-collapse-2.png') no-repeat 0px 0px;
+  _filter: progid:DXImageTransform.Microsoft.AlphaImageLoader(src='icon/dark/tree-collapse-2.png');
+  _background: none;
+}
 .bi-theme-dark .tree-collapse-icon-type2.native .x-icon,
 .bi-theme-dark .tree-collapse-icon-type2.disabled .x-icon {
   display: block;
@@ -193,6 +356,12 @@
   _filter: progid:DXImageTransform.Microsoft.AlphaImageLoader(src='icon/dark/tree-collapse-2.png');
   _background: none;
 }
+.bi-theme-dark .tree-collapse-icon-type2.native .x-icon.hack,
+.bi-theme-dark .tree-collapse-icon-type2.disabled .x-icon.hack {
+  background: url('icon/dark/tree-collapse-2.png') no-repeat 0px 0px;
+  _filter: progid:DXImageTransform.Microsoft.AlphaImageLoader(src='icon/dark/tree-collapse-2.png');
+  _background: none;
+}
 .bi-theme-dark .tree-collapse-icon-type3 .x-icon,
 .bi-theme-dark .tree-collapse-icon-type3:hover .x-icon,
 .bi-theme-dark .tree-collapse-icon-type3:active .x-icon {
@@ -201,6 +370,13 @@
   _filter: progid:DXImageTransform.Microsoft.AlphaImageLoader(src='icon/dark/tree-collapse-3.png');
   _background: none;
 }
+.bi-theme-dark .tree-collapse-icon-type3 .x-icon.hack,
+.bi-theme-dark .tree-collapse-icon-type3:hover .x-icon.hack,
+.bi-theme-dark .tree-collapse-icon-type3:active .x-icon.hack {
+  background: url('icon/dark/tree-collapse-3.png') no-repeat 0px 0px;
+  _filter: progid:DXImageTransform.Microsoft.AlphaImageLoader(src='icon/dark/tree-collapse-3.png');
+  _background: none;
+}
 .bi-theme-dark .tree-collapse-icon-type3.native .x-icon,
 .bi-theme-dark .tree-collapse-icon-type3.disabled .x-icon {
   display: block;
@@ -208,6 +384,12 @@
   _filter: progid:DXImageTransform.Microsoft.AlphaImageLoader(src='icon/dark/tree-collapse-3.png');
   _background: none;
 }
+.bi-theme-dark .tree-collapse-icon-type3.native .x-icon.hack,
+.bi-theme-dark .tree-collapse-icon-type3.disabled .x-icon.hack {
+  background: url('icon/dark/tree-collapse-3.png') no-repeat 0px 0px;
+  _filter: progid:DXImageTransform.Microsoft.AlphaImageLoader(src='icon/dark/tree-collapse-3.png');
+  _background: none;
+}
 .bi-theme-dark .tree-collapse-icon-type4 .x-icon,
 .bi-theme-dark .tree-collapse-icon-type4:hover .x-icon,
 .bi-theme-dark .tree-collapse-icon-type4:active .x-icon {
@@ -216,6 +398,13 @@
   _filter: progid:DXImageTransform.Microsoft.AlphaImageLoader(src='icon/dark/tree-collapse-4.png');
   _background: none;
 }
+.bi-theme-dark .tree-collapse-icon-type4 .x-icon.hack,
+.bi-theme-dark .tree-collapse-icon-type4:hover .x-icon.hack,
+.bi-theme-dark .tree-collapse-icon-type4:active .x-icon.hack {
+  background: url('icon/dark/tree-collapse-4.png') no-repeat 0px 0px;
+  _filter: progid:DXImageTransform.Microsoft.AlphaImageLoader(src='icon/dark/tree-collapse-4.png');
+  _background: none;
+}
 .bi-theme-dark .tree-collapse-icon-type4.native .x-icon,
 .bi-theme-dark .tree-collapse-icon-type4.disabled .x-icon {
   display: block;
@@ -223,6 +412,12 @@
   _filter: progid:DXImageTransform.Microsoft.AlphaImageLoader(src='icon/dark/tree-collapse-4.png');
   _background: none;
 }
+.bi-theme-dark .tree-collapse-icon-type4.native .x-icon.hack,
+.bi-theme-dark .tree-collapse-icon-type4.disabled .x-icon.hack {
+  background: url('icon/dark/tree-collapse-4.png') no-repeat 0px 0px;
+  _filter: progid:DXImageTransform.Microsoft.AlphaImageLoader(src='icon/dark/tree-collapse-4.png');
+  _background: none;
+}
 .bi-theme-dark .tree-expand-icon-type1 .x-icon,
 .bi-theme-dark .tree-expand-icon-type1:hover .x-icon,
 .bi-theme-dark .tree-expand-icon-type1:active .x-icon {
@@ -231,6 +426,13 @@
   _filter: progid:DXImageTransform.Microsoft.AlphaImageLoader(src='icon/dark/tree-expand-1.png');
   _background: none;
 }
+.bi-theme-dark .tree-expand-icon-type1 .x-icon.hack,
+.bi-theme-dark .tree-expand-icon-type1:hover .x-icon.hack,
+.bi-theme-dark .tree-expand-icon-type1:active .x-icon.hack {
+  background: url('icon/dark/tree-expand-1.png') no-repeat 0px 0px;
+  _filter: progid:DXImageTransform.Microsoft.AlphaImageLoader(src='icon/dark/tree-expand-1.png');
+  _background: none;
+}
 .bi-theme-dark .tree-expand-icon-type1.native .x-icon,
 .bi-theme-dark .tree-expand-icon-type1.disabled .x-icon {
   display: block;
@@ -238,6 +440,12 @@
   _filter: progid:DXImageTransform.Microsoft.AlphaImageLoader(src='icon/dark/tree-expand-1.png');
   _background: none;
 }
+.bi-theme-dark .tree-expand-icon-type1.native .x-icon.hack,
+.bi-theme-dark .tree-expand-icon-type1.disabled .x-icon.hack {
+  background: url('icon/dark/tree-expand-1.png') no-repeat 0px 0px;
+  _filter: progid:DXImageTransform.Microsoft.AlphaImageLoader(src='icon/dark/tree-expand-1.png');
+  _background: none;
+}
 .bi-theme-dark .tree-expand-icon-type2 .x-icon,
 .bi-theme-dark .tree-expand-icon-type2:hover .x-icon,
 .bi-theme-dark .tree-expand-icon-type2:active .x-icon {
@@ -246,6 +454,13 @@
   _filter: progid:DXImageTransform.Microsoft.AlphaImageLoader(src='icon/dark/tree-expand-2.png');
   _background: none;
 }
+.bi-theme-dark .tree-expand-icon-type2 .x-icon.hack,
+.bi-theme-dark .tree-expand-icon-type2:hover .x-icon.hack,
+.bi-theme-dark .tree-expand-icon-type2:active .x-icon.hack {
+  background: url('icon/dark/tree-expand-2.png') no-repeat 0px 0px;
+  _filter: progid:DXImageTransform.Microsoft.AlphaImageLoader(src='icon/dark/tree-expand-2.png');
+  _background: none;
+}
 .bi-theme-dark .tree-expand-icon-type2.native .x-icon,
 .bi-theme-dark .tree-expand-icon-type2.disabled .x-icon {
   display: block;
@@ -253,6 +468,12 @@
   _filter: progid:DXImageTransform.Microsoft.AlphaImageLoader(src='icon/dark/tree-expand-2.png');
   _background: none;
 }
+.bi-theme-dark .tree-expand-icon-type2.native .x-icon.hack,
+.bi-theme-dark .tree-expand-icon-type2.disabled .x-icon.hack {
+  background: url('icon/dark/tree-expand-2.png') no-repeat 0px 0px;
+  _filter: progid:DXImageTransform.Microsoft.AlphaImageLoader(src='icon/dark/tree-expand-2.png');
+  _background: none;
+}
 .bi-theme-dark .tree-expand-icon-type3 .x-icon,
 .bi-theme-dark .tree-expand-icon-type3:hover .x-icon,
 .bi-theme-dark .tree-expand-icon-type3:active .x-icon {
@@ -261,6 +482,13 @@
   _filter: progid:DXImageTransform.Microsoft.AlphaImageLoader(src='icon/dark/tree-expand-3.png');
   _background: none;
 }
+.bi-theme-dark .tree-expand-icon-type3 .x-icon.hack,
+.bi-theme-dark .tree-expand-icon-type3:hover .x-icon.hack,
+.bi-theme-dark .tree-expand-icon-type3:active .x-icon.hack {
+  background: url('icon/dark/tree-expand-3.png') no-repeat 0px 0px;
+  _filter: progid:DXImageTransform.Microsoft.AlphaImageLoader(src='icon/dark/tree-expand-3.png');
+  _background: none;
+}
 .bi-theme-dark .tree-expand-icon-type3.native .x-icon,
 .bi-theme-dark .tree-expand-icon-type3.disabled .x-icon {
   display: block;
@@ -268,6 +496,12 @@
   _filter: progid:DXImageTransform.Microsoft.AlphaImageLoader(src='icon/dark/tree-expand-3.png');
   _background: none;
 }
+.bi-theme-dark .tree-expand-icon-type3.native .x-icon.hack,
+.bi-theme-dark .tree-expand-icon-type3.disabled .x-icon.hack {
+  background: url('icon/dark/tree-expand-3.png') no-repeat 0px 0px;
+  _filter: progid:DXImageTransform.Microsoft.AlphaImageLoader(src='icon/dark/tree-expand-3.png');
+  _background: none;
+}
 .bi-theme-dark .tree-expand-icon-type4 .x-icon,
 .bi-theme-dark .tree-expand-icon-type4:hover .x-icon,
 .bi-theme-dark .tree-expand-icon-type4:active .x-icon {
@@ -276,6 +510,13 @@
   _filter: progid:DXImageTransform.Microsoft.AlphaImageLoader(src='icon/dark/tree-expand-4.png');
   _background: none;
 }
+.bi-theme-dark .tree-expand-icon-type4 .x-icon.hack,
+.bi-theme-dark .tree-expand-icon-type4:hover .x-icon.hack,
+.bi-theme-dark .tree-expand-icon-type4:active .x-icon.hack {
+  background: url('icon/dark/tree-expand-4.png') no-repeat 0px 0px;
+  _filter: progid:DXImageTransform.Microsoft.AlphaImageLoader(src='icon/dark/tree-expand-4.png');
+  _background: none;
+}
 .bi-theme-dark .tree-expand-icon-type4.native .x-icon,
 .bi-theme-dark .tree-expand-icon-type4.disabled .x-icon {
   display: block;
@@ -283,6 +524,12 @@
   _filter: progid:DXImageTransform.Microsoft.AlphaImageLoader(src='icon/dark/tree-expand-4.png');
   _background: none;
 }
+.bi-theme-dark .tree-expand-icon-type4.native .x-icon.hack,
+.bi-theme-dark .tree-expand-icon-type4.disabled .x-icon.hack {
+  background: url('icon/dark/tree-expand-4.png') no-repeat 0px 0px;
+  _filter: progid:DXImageTransform.Microsoft.AlphaImageLoader(src='icon/dark/tree-expand-4.png');
+  _background: none;
+}
 .bi-theme-dark .tree-vertical-line-type2 .x-icon,
 .bi-theme-dark .tree-vertical-line-type2:hover .x-icon,
 .bi-theme-dark .tree-vertical-line-type2:active .x-icon {
@@ -291,6 +538,13 @@
   _filter: progid:DXImageTransform.Microsoft.AlphaImageLoader(src='icon/dark/tree-vertical-line-2.png');
   _background: none;
 }
+.bi-theme-dark .tree-vertical-line-type2 .x-icon.hack,
+.bi-theme-dark .tree-vertical-line-type2:hover .x-icon.hack,
+.bi-theme-dark .tree-vertical-line-type2:active .x-icon.hack {
+  background: url('icon/dark/tree-vertical-line-2.png') no-repeat 0px 0px;
+  _filter: progid:DXImageTransform.Microsoft.AlphaImageLoader(src='icon/dark/tree-vertical-line-2.png');
+  _background: none;
+}
 .bi-theme-dark .tree-vertical-line-type2.native .x-icon,
 .bi-theme-dark .tree-vertical-line-type2.disabled .x-icon {
   display: block;
@@ -298,6 +552,12 @@
   _filter: progid:DXImageTransform.Microsoft.AlphaImageLoader(src='icon/dark/tree-vertical-line-2.png');
   _background: none;
 }
+.bi-theme-dark .tree-vertical-line-type2.native .x-icon.hack,
+.bi-theme-dark .tree-vertical-line-type2.disabled .x-icon.hack {
+  background: url('icon/dark/tree-vertical-line-2.png') no-repeat 0px 0px;
+  _filter: progid:DXImageTransform.Microsoft.AlphaImageLoader(src='icon/dark/tree-vertical-line-2.png');
+  _background: none;
+}
 .bi-theme-dark .tree-vertical-line-type3 .x-icon,
 .bi-theme-dark .tree-vertical-line-type3:hover .x-icon,
 .bi-theme-dark .tree-vertical-line-type3:active .x-icon {
@@ -306,6 +566,13 @@
   _filter: progid:DXImageTransform.Microsoft.AlphaImageLoader(src='icon/dark/tree-vertical-line-3.png');
   _background: none;
 }
+.bi-theme-dark .tree-vertical-line-type3 .x-icon.hack,
+.bi-theme-dark .tree-vertical-line-type3:hover .x-icon.hack,
+.bi-theme-dark .tree-vertical-line-type3:active .x-icon.hack {
+  background: url('icon/dark/tree-vertical-line-3.png') no-repeat 0px 0px;
+  _filter: progid:DXImageTransform.Microsoft.AlphaImageLoader(src='icon/dark/tree-vertical-line-3.png');
+  _background: none;
+}
 .bi-theme-dark .tree-vertical-line-type3.native .x-icon,
 .bi-theme-dark .tree-vertical-line-type3.disabled .x-icon {
   display: block;
@@ -313,6 +580,12 @@
   _filter: progid:DXImageTransform.Microsoft.AlphaImageLoader(src='icon/dark/tree-vertical-line-3.png');
   _background: none;
 }
+.bi-theme-dark .tree-vertical-line-type3.native .x-icon.hack,
+.bi-theme-dark .tree-vertical-line-type3.disabled .x-icon.hack {
+  background: url('icon/dark/tree-vertical-line-3.png') no-repeat 0px 0px;
+  _filter: progid:DXImageTransform.Microsoft.AlphaImageLoader(src='icon/dark/tree-vertical-line-3.png');
+  _background: none;
+}
 .bi-theme-dark .tree-vertical-line-type4 .x-icon,
 .bi-theme-dark .tree-vertical-line-type4:hover .x-icon,
 .bi-theme-dark .tree-vertical-line-type4:active .x-icon {
@@ -321,6 +594,13 @@
   _filter: progid:DXImageTransform.Microsoft.AlphaImageLoader(src='icon/dark/tree-vertical-line-4.png');
   _background: none;
 }
+.bi-theme-dark .tree-vertical-line-type4 .x-icon.hack,
+.bi-theme-dark .tree-vertical-line-type4:hover .x-icon.hack,
+.bi-theme-dark .tree-vertical-line-type4:active .x-icon.hack {
+  background: url('icon/dark/tree-vertical-line-4.png') no-repeat 0px 0px;
+  _filter: progid:DXImageTransform.Microsoft.AlphaImageLoader(src='icon/dark/tree-vertical-line-4.png');
+  _background: none;
+}
 .bi-theme-dark .tree-vertical-line-type4.native .x-icon,
 .bi-theme-dark .tree-vertical-line-type4.disabled .x-icon {
   display: block;
@@ -328,12 +608,23 @@
   _filter: progid:DXImageTransform.Microsoft.AlphaImageLoader(src='icon/dark/tree-vertical-line-4.png');
   _background: none;
 }
+.bi-theme-dark .tree-vertical-line-type4.native .x-icon.hack,
+.bi-theme-dark .tree-vertical-line-type4.disabled .x-icon.hack {
+  background: url('icon/dark/tree-vertical-line-4.png') no-repeat 0px 0px;
+  _filter: progid:DXImageTransform.Microsoft.AlphaImageLoader(src='icon/dark/tree-vertical-line-4.png');
+  _background: none;
+}
 .check-box-icon .x-icon {
   display: block;
   background: url('icon/check-box-normal.png') no-repeat 0 0;
   _filter: progid:DXImageTransform.Microsoft.AlphaImageLoader(src='icon/check-box-normal.png');
   _background: none;
 }
+.check-box-icon .x-icon.hack {
+  background: url('icon/check-box-normal.png') no-repeat 0 0;
+  _filter: progid:DXImageTransform.Microsoft.AlphaImageLoader(src='icon/check-box-normal.png');
+  _background: none;
+}
 .check-box-icon:hover .x-icon,
 .check-box-icon:focus .x-icon,
 .check-box-icon.hover .x-icon {
@@ -342,6 +633,13 @@
   _filter: progid:DXImageTransform.Microsoft.AlphaImageLoader(src='icon/check-box-normal.png');
   _background: none;
 }
+.check-box-icon:hover .x-icon.hack,
+.check-box-icon:focus .x-icon.hack,
+.check-box-icon.hover .x-icon.hack {
+  background: url('icon/check-box-normal.png') no-repeat 0 0;
+  _filter: progid:DXImageTransform.Microsoft.AlphaImageLoader(src='icon/check-box-normal.png');
+  _background: none;
+}
 .check-box-icon:active .x-icon,
 .check-box-icon.active .x-icon {
   display: block;
@@ -349,6 +647,12 @@
   _filter: progid:DXImageTransform.Microsoft.AlphaImageLoader(src='icon/check-box-active.png');
   _background: none;
 }
+.check-box-icon:active .x-icon.hack,
+.check-box-icon.active .x-icon.hack {
+  background: url('icon/check-box-active.png') no-repeat 0 0;
+  _filter: progid:DXImageTransform.Microsoft.AlphaImageLoader(src='icon/check-box-active.png');
+  _background: none;
+}
 .check-box-icon.native .x-icon,
 .check-box-icon.disabled .x-icon {
   display: block;
@@ -356,6 +660,12 @@
   _filter: progid:DXImageTransform.Microsoft.AlphaImageLoader(src='icon/check-box-disable.png');
   _background: none;
 }
+.check-box-icon.native .x-icon.hack,
+.check-box-icon.disabled .x-icon.hack {
+  background: url('icon/check-box-disable.png') no-repeat 0 0;
+  _filter: progid:DXImageTransform.Microsoft.AlphaImageLoader(src='icon/check-box-disable.png');
+  _background: none;
+}
 .check-box-icon.native .x-icon,
 .check-box-icon.disabled.active .x-icon {
   display: block;
@@ -363,12 +673,23 @@
   _filter: progid:DXImageTransform.Microsoft.AlphaImageLoader(src='icon/check-box-disable2.png');
   _background: none;
 }
+.check-box-icon.native .x-icon.hack,
+.check-box-icon.disabled.active .x-icon.hack {
+  background: url('icon/check-box-disable2.png') no-repeat 0 0;
+  _filter: progid:DXImageTransform.Microsoft.AlphaImageLoader(src='icon/check-box-disable2.png');
+  _background: none;
+}
 .radio-icon .x-icon {
   display: block;
   background: url('icon/radio-normal.png') no-repeat 0 0;
   _filter: progid:DXImageTransform.Microsoft.AlphaImageLoader(src='icon/radio-normal.png');
   _background: none;
 }
+.radio-icon .x-icon.hack {
+  background: url('icon/radio-normal.png') no-repeat 0 0;
+  _filter: progid:DXImageTransform.Microsoft.AlphaImageLoader(src='icon/radio-normal.png');
+  _background: none;
+}
 .radio-icon:hover .x-icon,
 .radio-icon:focus .x-icon,
 .radio-icon.hover .x-icon {
@@ -377,6 +698,13 @@
   _filter: progid:DXImageTransform.Microsoft.AlphaImageLoader(src='icon/radio-normal.png');
   _background: none;
 }
+.radio-icon:hover .x-icon.hack,
+.radio-icon:focus .x-icon.hack,
+.radio-icon.hover .x-icon.hack {
+  background: url('icon/radio-normal.png') no-repeat 0 0;
+  _filter: progid:DXImageTransform.Microsoft.AlphaImageLoader(src='icon/radio-normal.png');
+  _background: none;
+}
 .radio-icon:active .x-icon,
 .radio-icon.active .x-icon {
   display: block;
@@ -384,6 +712,12 @@
   _filter: progid:DXImageTransform.Microsoft.AlphaImageLoader(src='icon/radio-active.png');
   _background: none;
 }
+.radio-icon:active .x-icon.hack,
+.radio-icon.active .x-icon.hack {
+  background: url('icon/radio-active.png') no-repeat 0 0;
+  _filter: progid:DXImageTransform.Microsoft.AlphaImageLoader(src='icon/radio-active.png');
+  _background: none;
+}
 .radio-icon.native .x-icon,
 .radio-icon.disabled .x-icon {
   display: block;
@@ -391,6 +725,12 @@
   _filter: progid:DXImageTransform.Microsoft.AlphaImageLoader(src='icon/radio-disable.png');
   _background: none;
 }
+.radio-icon.native .x-icon.hack,
+.radio-icon.disabled .x-icon.hack {
+  background: url('icon/radio-disable.png') no-repeat 0 0;
+  _filter: progid:DXImageTransform.Microsoft.AlphaImageLoader(src='icon/radio-disable.png');
+  _background: none;
+}
 .radio-icon.native .x-icon,
 .radio-icon.disabled.active .x-icon {
   display: block;
@@ -398,6 +738,12 @@
   _filter: progid:DXImageTransform.Microsoft.AlphaImageLoader(src='icon/radio-disable2.png');
   _background: none;
 }
+.radio-icon.native .x-icon.hack,
+.radio-icon.disabled.active .x-icon.hack {
+  background: url('icon/radio-disable2.png') no-repeat 0 0;
+  _filter: progid:DXImageTransform.Microsoft.AlphaImageLoader(src='icon/radio-disable2.png');
+  _background: none;
+}
 .check-half-select-icon .x-icon,
 .check-half-select-icon:hover .x-icon,
 .check-half-select-icon:active .x-icon {
@@ -406,6 +752,13 @@
   _filter: progid:DXImageTransform.Microsoft.AlphaImageLoader(src='icon/half_selected.png');
   _background: none;
 }
+.check-half-select-icon .x-icon.hack,
+.check-half-select-icon:hover .x-icon.hack,
+.check-half-select-icon:active .x-icon.hack {
+  background: url('icon/half_selected.png') no-repeat 0px 0px;
+  _filter: progid:DXImageTransform.Microsoft.AlphaImageLoader(src='icon/half_selected.png');
+  _background: none;
+}
 .check-half-select-icon.native .x-icon,
 .check-half-select-icon.disabled .x-icon {
   display: block;
@@ -413,3 +766,9 @@
   _filter: progid:DXImageTransform.Microsoft.AlphaImageLoader(src='icon/half_selected.png');
   _background: none;
 }
+.check-half-select-icon.native .x-icon.hack,
+.check-half-select-icon.disabled .x-icon.hack {
+  background: url('icon/half_selected.png') no-repeat 0px 0px;
+  _filter: progid:DXImageTransform.Microsoft.AlphaImageLoader(src='icon/half_selected.png');
+  _background: none;
+}

src/less/image.less

@@ -11,43 +11,64 @@
   _background: none;
 }
 
+.image2xPath(@path, @top:center, @left:center, @repeat: no-repeat) when not (@path = none) {
+  background: url('@{image2xUrl}@{path}') @repeat @left @top;
+  _filter: progid:DXImageTransform.Microsoft.AlphaImageLoader(src='@{image2xUrl}@{path}');
+  _background: none;
+}
+
 .icon(@class, @iconPath, @top:0px, @left:0px) {
   .@{class} {
     & .x-icon,
     &:hover .x-icon,
     &:active .x-icon {
       display: block;
+      .image2xPath(@iconPath, -@top, -@left);
+      &.hack {
         .imagePath(@iconPath, -@top, -@left);
       }
+    }
     &.native .x-icon,
     &.disabled .x-icon {
       display: block;
+      .image2xPath(@iconPath, -@top, -@left);
+      &.hack {
         .imagePath(@iconPath, -@top, -@left);
       }
     }
   }
+}
 
 .icon_hover(@class, @iconPath, @top:0px, @left:0px, @distance: 20) {
   .@{class} {
     & .x-icon {
       display: block;
+      .image2xPath(@iconPath, -@top, -@left);
+      &.hack {
         .imagePath(@iconPath, -@top, -@left);
       }
+    }
     &:hover .x-icon,
     &:focus .x-icon,
     &.hover .x-icon,
     &:active .x-icon,
     &.active .x-icon {
       display: block;
+      .image2xPath(@iconPath, -@top, -(@left + @distance));
+      &.hack {
         .imagePath(@iconPath, -@top, -(@left + @distance));
       }
+    }
     &.native .x-icon,
     &.disabled .x-icon {
       display: block;
+      .image2xPath(@iconPath, -@top, -@left);
+      &.hack {
         .imagePath(@iconPath, -@top, -@left);
       }
     }
   }
+}
 
 .icon_active(@class, @iconPath, @top:0px, @left:0px, @distance: 20) {
   .@{class} {
@@ -56,116 +77,170 @@
     &:focus .x-icon,
     &.hover .x-icon {
       display: block;
+      .image2xPath(@iconPath, -@top, -@left);
+      &.hack {
         .imagePath(@iconPath, -@top, -@left);
       }
+    }
     &:active .x-icon,
     &.active .x-icon {
       display: block;
+      .image2xPath(@iconPath, -@top, -(@left + @distance));
+      &.hack {
         .imagePath(@iconPath, -@top, -(@left + @distance));
       }
+    }
     &.native .x-icon,
     &.disabled .x-icon {
       display: block;
+      .image2xPath(@iconPath, -@top, -@left);
+      &.hack {
         .imagePath(@iconPath, -@top, -@left);
       }
     }
   }
+}
 
 .icon_hover_active(@class, @iconPath, @top:0px, @left:0px, @distance: 20) {
   .@{class} {
     & .x-icon {
       display: block;
+      .image2xPath(@iconPath, -@top, -@left);
+      &.hack {
         .imagePath(@iconPath, -@top, -@left);
       }
+    }
     &:hover .x-icon,
     &:focus .x-icon,
     &.hover .x-icon {
       display: block;
+      .image2xPath(@iconPath, -@top, -(@left+@distance));
+      &.hack {
         .imagePath(@iconPath, -@top, -(@left+@distance));
       }
+    }
 
     &:active .x-icon,
     &.active .x-icon {
       display: block;
+      .image2xPath(@iconPath, -@top, -(@left+@distance*2));
+      &.hack {
         .imagePath(@iconPath, -@top, -(@left+@distance*2));
       }
+    }
     &.native .x-icon,
     &.disabled .x-icon {
       display: block;
+      .image2xPath(@iconPath, -@top, -@left);
+      &.hack {
         .imagePath(@iconPath, -@top, -@left);
       }
     }
   }
+}
 
 .icon_select(@class, @iconPath, @top:0px, @left:0px, @distance: 20) {
   .@{class} {
     & .x-icon {
       display: block;
+      .image2xPath(@iconPath, -@top, -@left);
+      &.hack {
         .imagePath(@iconPath, -@top, -@left);
       }
+    }
     &.active .x-icon {
       display: block;
+      .image2xPath(@iconPath, -@top, -(@left+@distance));
+      &.hack {
         .imagePath(@iconPath, -@top, -(@left+@distance));
       }
+    }
     &.native .x-icon,
     &.disabled .x-icon {
       display: block;
+      .image2xPath(@iconPath, -@top, -@left);
+      &.hack {
         .imagePath(@iconPath, -@top, -@left);
       }
     }
   }
+}
 
 .icon_custom(@class, @iconPath, @hoverPath:none, @activePath:none, @disablePath:none, @activeDisablePath:none) {
   .@{class} {
     & .x-icon {
       display: block;
+      .image2xPath(@iconPath, 0, 0);
+      &.hack {
         .imagePath(@iconPath, 0, 0);
       }
+    }
     &:hover .x-icon,
     &:focus .x-icon,
     &.hover .x-icon {
       display: block;
+      .image2xPath(@hoverPath, 0, 0);
+      &.hack {
         .imagePath(@hoverPath, 0, 0);
       }
+    }
 
     &:active .x-icon,
     &.active .x-icon {
       display: block;
+      .image2xPath(@activePath, 0, 0);
+      &.hack {
         .imagePath(@activePath, 0, 0);
       }
+    }
     &.native .x-icon,
     &.disabled .x-icon {
       display: block;
+      .image2xPath(@disablePath, 0, 0);
+      &.hack {
         .imagePath(@disablePath, 0, 0);
       }
+    }
     &.native .x-icon,
     &.disabled.active .x-icon {
       display: block;
+      .image2xPath(@activeDisablePath, 0, 0);
+      &.hack {
         .imagePath(@activeDisablePath, 0, 0);
       }
     }
   }
+}
 
 .icon_custom_hover(@class, @iconPath, @hoverPath:none, @disablePath:none) {
   .@{class} {
     & .x-icon {
       display: block;
+      .image2xPath(@iconPath, 0, 0);
+      &.hack {
         .imagePath(@iconPath, 0, 0);
       }
+    }
     &:hover .x-icon,
     &:focus .x-icon,
     &.hover .x-icon {
       display: block;
+      .image2xPath(@hoverPath, 0, 0);
+      &.hack {
         .imagePath(@hoverPath, 0, 0);
       }
+    }
 
     &.native .x-icon,
     &.disabled .x-icon {
       display: block;
+      .image2xPath(@disablePath, 0, 0);
+      &.hack {
         .imagePath(@disablePath, 0, 0);
       }
     }
   }
+}
 
 //
 @color-bi-font-native: inherit;
@@ -178,7 +253,7 @@
   @fc: "\@{content}";
   .@{class} {
     & .b-font {
-      *zoom: ~"expression( this.runtimeStyle['zoom'] = '1',this.innerHTML = '&#x@{content}')";
+      *zoom: ~"expression( this.runtimeStyle['zoom'] = '1',this.innerHTML = '&#x@{content};')";
     }
     & .b-font:before {
       content: @fc;
@@ -196,7 +271,7 @@
   @fc: "\@{content}";
   .@{class} {
     & .b-font {
-      *zoom: ~"expression( this.runtimeStyle['zoom'] = '1',this.innerHTML = '&#x@{content}')";
+      *zoom: ~"expression( this.runtimeStyle['zoom'] = '1',this.innerHTML = '&#x@{content};')";
     }
     & .b-font:before {
       content: @fc;
@@ -220,7 +295,7 @@
   @fc: "\@{content}";
   .@{class} {
     & .b-font {
-      *zoom: ~"expression( this.runtimeStyle['zoom'] = '1',this.innerHTML = '&#x@{content}')";
+      *zoom: ~"expression( this.runtimeStyle['zoom'] = '1',this.innerHTML = '&#x@{content};')";
     }
     & .b-font:before {
       content: @fc;
@@ -252,7 +327,7 @@
   @fc: "\@{content}";
   .@{class} {
     & .b-font {
-      *zoom: ~"expression( this.runtimeStyle['zoom'] = '1',this.innerHTML = '&#x@{content}')";
+      *zoom: ~"expression( this.runtimeStyle['zoom'] = '1',this.innerHTML = '&#x@{content};')";
     }
     & .b-font:before {
       content: @fc;

src/less/var.less

@@ -1,5 +1,6 @@
 @webUrl: '';
 @imageUrl: ''; //图片的基本地址
+@image2xUrl: ''; //图片的基本地址
 
 @cursor: '@{imageUrl}cursor/cursor_hand.cur';
 @dragCursor: '@{imageUrl}cursor/cursor_drag_hand.cur';