Browse Source

BI-90860 refactor: 树类型控件的复选半选不使用图片

es6
windy 3 years ago
parent
commit
0e640c13b8
  1. 14
      src/case/button/icon/iconhalf/icon.half.js
  2. 18
      src/case/ztree/jquery.ztree.excheck-3.5.js
  3. 9
      src/less/base/single/button/button.half.less
  4. 18
      src/less/base/single/input/checkbox.less
  5. 18
      src/less/base/single/input/radio.less
  6. 19
      src/less/base/tree/ztree.less
  7. 40
      src/less/resource/background.less

14
src/case/button/icon/iconhalf/icon.half.js

@ -14,20 +14,6 @@ BI.HalfButton = BI.inherit(BI.BasicButton, {
}); });
}, },
_init: function () {
BI.HalfButton.superclass._init.apply(this, arguments);
BI.createWidget({
type: "bi.center_adapt",
element: this.element,
items: [{
type: "bi.layout",
cls: "bi-high-light-background",
width: 8,
height: 8
}]
});
},
doClick: function () { doClick: function () {
BI.HalfButton.superclass.doClick.apply(this, arguments); BI.HalfButton.superclass.doClick.apply(this, arguments);
if(this.isValid()) { if(this.isValid()) {

18
src/case/ztree/jquery.ztree.excheck-3.5.js

@ -439,7 +439,23 @@
} }
var chkName = setting.check.chkStyle + "_" + (node[checkedKey] ? c.TRUE : c.FALSE) + "_" + fullStyle; var chkName = setting.check.chkStyle + "_" + (node[checkedKey] ? c.TRUE : c.FALSE) + "_" + fullStyle;
chkName = (node.check_Focus && node.chkDisabled !== true) ? chkName + "_" + c.FOCUS : chkName; chkName = (node.check_Focus && node.chkDisabled !== true) ? chkName + "_" + c.FOCUS : chkName;
return consts.className.BUTTON + " " + c.DEFAULT + " " + chkName; var chClass = consts.className.BUTTON + " " + c.DEFAULT + " " + chkName;
switch (chkName) {
case 'checkbox_true_part':
case 'checkbox_true_part_focus':
chClass += ' bi-half-button bi-high-light-border';
break;
case 'checkbox_true_full':
case 'checkbox_true_full_focus':
chClass += ' bi-checkbox checkbox-content bi-high-light-background active';
break;
case 'checkbox_false_full':
case 'checkbox_false_full_focus':
default:
chClass += ' bi-checkbox checkbox-content';
break;
}
return chClass;
}, },
repairAllChk: function(setting, checked) { repairAllChk: function(setting, checked) {
if (setting.check.enable && setting.check.chkStyle === consts.checkbox.STYLE) { if (setting.check.enable && setting.check.chkStyle === consts.checkbox.STYLE) {

9
src/less/base/single/button/button.half.less

@ -2,4 +2,13 @@
.bi-half-button { .bi-half-button {
.border-radius(2px); .border-radius(2px);
&:after {
position: absolute;
left: 3px;
top: 3px;
width: 8px;
height: 8px;
background-color: @color-bi-background-highlight;
content: '';
}
} }

18
src/less/base/single/input/checkbox.less

@ -1,7 +1,7 @@
@import "../../../index"; @import "../../../index";
.bi-checkbox { .bi-checkbox {
& .checkbox-content { & .checkbox-content, &.checkbox-content {
.border-radius(2px); .border-radius(2px);
border: 1px solid @color-bi-border-dark-line; border: 1px solid @color-bi-border-dark-line;
&:after { &:after {
@ -22,7 +22,7 @@
} }
} }
&.active, &:active { &.active, &:active {
& .checkbox-content{ & .checkbox-content, &.checkbox-content{
border-color: @color-bi-border-highlight; border-color: @color-bi-border-highlight;
&:after { &:after {
border-color: @color-bi-border-default; border-color: @color-bi-border-default;
@ -31,15 +31,15 @@
} }
} }
&.disabled { &.disabled {
& .checkbox-content { & .checkbox-content, &.checkbox-content {
background-color: @color-bi-background-disabled; background-color: @color-bi-background-disabled;
border-color: @color-bi-border-disabled; border-color: @color-bi-border-disabled;
} }
& .checkbox-content:after { & .checkbox-content:after, &.checkbox-content:after {
opacity: 0; opacity: 0;
} }
&.active { &.active {
& .checkbox-content { & .checkbox-content, &.checkbox-content {
background-color: @color-bi-background-dark-gray; background-color: @color-bi-background-dark-gray;
&:after { &:after {
opacity: 1; opacity: 1;
@ -51,23 +51,23 @@
.bi-theme-dark { .bi-theme-dark {
.bi-checkbox { .bi-checkbox {
& .checkbox-content { & .checkbox-content, &.checkbox-content {
border-color: @color-bi-border-dark-line-theme-dark; border-color: @color-bi-border-dark-line-theme-dark;
&.hover, &:hover { &.hover, &:hover {
border-color: @color-bi-border-highlight; border-color: @color-bi-border-highlight;
} }
} }
&.active, &:active { &.active, &:active {
& .checkbox-content { & .checkbox-content, &.checkbox-content {
border-color: @color-bi-border-highlight; border-color: @color-bi-border-highlight;
} }
} }
&.disabled { &.disabled {
& .checkbox-content { & .checkbox-content, &.checkbox-content {
background-color: @color-bi-background-disabled-theme-dark; background-color: @color-bi-background-disabled-theme-dark;
} }
&.active { &.active {
& .checkbox-content { & .checkbox-content, &.checkbox-content {
background-color: @color-bi-background-dark-gray-theme-dark; background-color: @color-bi-background-dark-gray-theme-dark;
border-color: @color-bi-border-disabled-theme-dark; border-color: @color-bi-border-disabled-theme-dark;
} }

18
src/less/base/single/input/radio.less

@ -1,7 +1,7 @@
@import "../../../index"; @import "../../../index";
.bi-radio { .bi-radio {
& .radio-content { & .radio-content, &.radio-content {
.border-radius(8px); .border-radius(8px);
border: 1px solid @color-bi-border-dark-line; border: 1px solid @color-bi-border-dark-line;
&:after { &:after {
@ -12,7 +12,7 @@
} }
} }
&:active, &.active { &:active, &.active {
& .radio-content { & .radio-content, &.radio-content {
border-color: @color-bi-border-highlight; border-color: @color-bi-border-highlight;
&:after { &:after {
width: 6px; width: 6px;
@ -28,15 +28,15 @@
} }
} }
&.disabled { &.disabled {
& .radio-content { & .radio-content, &.radio-content {
background-color: @color-bi-background-disabled; background-color: @color-bi-background-disabled;
border-color: @color-bi-border-disabled; border-color: @color-bi-border-disabled;
} }
& .radio-content:after { & .radio-content:after, &.radio-content:after {
background-color: transparent; background-color: transparent;
} }
&.active { &.active {
& .radio-content { & .radio-content, &.radio-content {
background-color: @color-bi-background-dark-gray; background-color: @color-bi-background-dark-gray;
&:after { &:after {
background-color: @color-bi-background-default; background-color: @color-bi-background-default;
@ -48,26 +48,26 @@
.bi-theme-dark { .bi-theme-dark {
.bi-radio { .bi-radio {
& .radio-content { & .radio-content, &.radio-content {
border-color: @color-bi-border-dark-line-theme-dark; border-color: @color-bi-border-dark-line-theme-dark;
&.hover, &:hover { &.hover, &:hover {
border-color: @color-bi-border-highlight; border-color: @color-bi-border-highlight;
} }
} }
&.active, &:active { &.active, &:active {
& .radio-content { & .radio-content, &.radio-content {
border-color: @color-bi-border-highlight; border-color: @color-bi-border-highlight;
} }
} }
&.disabled { &.disabled {
& .radio-content { & .radio-content, &.radio-content {
background-color: @color-bi-background-disabled-theme-dark; background-color: @color-bi-background-disabled-theme-dark;
&.hover, &:hover { &.hover, &:hover {
border-color: @color-bi-border-dark-line-theme-dark; border-color: @color-bi-border-dark-line-theme-dark;
} }
} }
&.active { &.active {
& .radio-content { & .radio-content, &.radio-content {
background-color: @color-bi-background-dark-gray-theme-dark; background-color: @color-bi-background-dark-gray-theme-dark;
border-color: @color-bi-border-disabled-theme-dark; border-color: @color-bi-border-disabled-theme-dark;
} }

19
src/less/base/tree/ztree.less

@ -106,8 +106,23 @@
} }
.ztree li span.button.chk { .ztree li span.button.chk {
width: 16px; &.bi-checkbox {
height: 16px; border: 1px solid @color-bi-border-dark-line;
&.active {
background-color: @color-bi-background-highlight;
border-color: @color-bi-border-highlight;;
}
}
&.bi-half-button {
border: 1px solid @color-bi-border-highlight;
}
}
.ztree li span.button.chk {
position: relative;
width: 14px;
height: 14px;
margin: 0 3px 0 0; margin: 0 3px 0 0;
cursor: auto cursor: auto
} }

40
src/less/resource/background.less

@ -70,46 +70,6 @@
} }
} }
.ztree li span.button.chk.checkbox_false_full {
.image2xPath(@icon-checkbox-normal);
}
.ztree li span.button.chk.checkbox_false_full_focus {
.image2xPath(@icon-checkbox-normal);
}
.ztree li span.button.chk.checkbox_false_part {
.image2xPath(@icon-half-select);
}
.ztree li span.button.chk.checkbox_false_part_focus {
.image2xPath(@icon-half-select);
}
.ztree li span.button.chk.checkbox_true_full {
.image2xPath(@icon-checkbox-active);
}
.ztree li span.button.chk.checkbox_true_full_focus {
.image2xPath(@icon-checkbox-active);
}
.ztree li span.button.chk.checkbox_true_part {
.image2xPath(@icon-half-select);
}
.ztree li span.button.chk.checkbox_true_part_focus {
.image2xPath(@icon-half-select);
}
.ztree.hack li span.button.chk.checkbox_false_full {
.imagePath(@icon-checkbox-normal);
}
.ztree.hack li span.button.chk.checkbox_false_full_focus {
.imagePath(@icon-checkbox-normal);
}
.ztree.hack li span.button.chk.checkbox_false_part { .ztree.hack li span.button.chk.checkbox_false_part {
.imagePath(@icon-half-select); .imagePath(@icon-half-select);
} }

Loading…
Cancel
Save