Browse Source

Merge pull request #252287 in DEC/fineui from master to feature/x

* commit '9df9b64314d9875a65acbc6c477e28cd365cce44':
  BI-129591 feat: HexColorChooserPopup 支持配置自动和透明
research/test
superman 1 year ago
parent
commit
30c4ee4ee8
  1. 2
      packages/fineui/src/case/colorchooser/colorchooser.popup.hex.js
  2. 47
      packages/fineui/src/case/colorchooser/colorpicker/editor.colorpicker.hex.js

2
packages/fineui/src/case/colorchooser/colorchooser.popup.hex.js

@ -69,6 +69,8 @@ export class HexColorChooserPopup extends Widget {
: HexColorPickerEditor.xtype,
value: o.value,
height: o.simple ? 36 : 70,
transparent: o.transparent,
auto: o.auto,
listeners: [
{
eventName: ColorPickerEditor.EVENT_CHANGE,

47
packages/fineui/src/case/colorchooser/colorpicker/editor.colorpicker.hex.js

@ -41,6 +41,8 @@ export class HexColorPickerEditor extends Widget {
props = {
baseCls: "bi-color-picker-editor bi-hex-color-picker-editor",
height: 30,
transparent: true,
auto: true,
};
render() {
@ -95,23 +97,27 @@ export class HexColorPickerEditor extends Widget {
height: 24,
items: [
{
type: ColorChooserShowButton.xtype,
cls: "trans-color-icon",
height: 22,
title: i18nText("BI-Transparent_Color"),
text: i18nText("BI-Transparent_Color"),
listeners: [
{
eventName: ColorChooserShowButton.EVENT_CHANGE,
action: () => {
this.setValue("transparent");
this.fireEvent(ColorPickerEditor.EVENT_CHANGE);
},
}
],
ref: _ref => {
this.transparent = _ref;
el: {
type: ColorChooserShowButton.xtype,
cls: "trans-color-icon",
height: 22,
title: i18nText("BI-Transparent_Color"),
text: i18nText("BI-Transparent_Color"),
invisible: !this.options.transparent,
listeners: [
{
eventName: ColorChooserShowButton.EVENT_CHANGE,
action: () => {
this.setValue("transparent");
this.fireEvent(ColorPickerEditor.EVENT_CHANGE);
},
}
],
ref: _ref => {
this.transparent = _ref;
},
},
rgap: this.options.auto ? 5 : 0,
},
{
el: {
@ -120,6 +126,7 @@ export class HexColorPickerEditor extends Widget {
height: 22,
title: i18nText("BI-Basic_Auto"),
text: i18nText("BI-Basic_Auto"),
invisible: !this.options.auto,
listeners: [
{
eventName: ColorChooserShowButton.EVENT_CHANGE,
@ -133,7 +140,7 @@ export class HexColorPickerEditor extends Widget {
this.none = _ref;
},
},
lgap: 10,
lgap: this.options.transparent ? 5 : 0,
}
],
},
@ -176,6 +183,9 @@ export class HexColorPickerEditor extends Widget {
{
eventName: "EVENT_CHANGE",
action: () => {
if (isEmptyString(this.hexEditor.getValue())) {
return;
}
this._checkHexEditor();
if (
checker(this.storeValue.r) &&
@ -261,9 +271,6 @@ export class HexColorPickerEditor extends Widget {
}
_checkHexEditor() {
if (isEmptyString(this.hexEditor.getValue())) {
this.hexEditor.setValue("000000");
}
const json = DOM.rgb2json(DOM.hex2rgb(`#${this.hexEditor.getValue()}`));
this.storeValue = {
r: json.r || 0,

Loading…
Cancel
Save