mirror of https://github.com/ElemeFE/element
ColorPicker: support hsl/hsv model input (#9991)
parent
e70c598d44
commit
f1b483a91a
|
@ -202,9 +202,9 @@ export default class Color {
|
||||||
}
|
}
|
||||||
|
|
||||||
const fromHSV = (h, s, v) => {
|
const fromHSV = (h, s, v) => {
|
||||||
this._hue = h;
|
this._hue = Math.max(0, Math.min(360, h));
|
||||||
this._saturation = s;
|
this._saturation = Math.max(0, Math.min(100, s));
|
||||||
this._value = v;
|
this._value = Math.max(0, Math.min(100, v));
|
||||||
|
|
||||||
this.doOnChange();
|
this.doOnChange();
|
||||||
};
|
};
|
||||||
|
|
|
@ -84,26 +84,7 @@
|
||||||
},
|
},
|
||||||
|
|
||||||
handleConfirm() {
|
handleConfirm() {
|
||||||
const valid = this.showAlpha ? this.validRGBA(this.customInput) : this.validRGBHex(this.customInput);
|
this.color.fromString(this.customInput);
|
||||||
if (valid) {
|
|
||||||
this.color.fromString(this.customInput);
|
|
||||||
} else {
|
|
||||||
this.customInput = this.currentColor;
|
|
||||||
}
|
|
||||||
},
|
|
||||||
|
|
||||||
validRGBHex(color) {
|
|
||||||
return /^#[A-Fa-f0-9]{6}$/.test(color);
|
|
||||||
},
|
|
||||||
|
|
||||||
validRGBA(color) {
|
|
||||||
const matches = color.match(/^rgba\((\d+), ?(\d+), ?(\d+), ?([.0-9]+)\)$/);
|
|
||||||
if (!matches) return false;
|
|
||||||
const list = matches.map(v => parseInt(v, 10)).slice(1);
|
|
||||||
if (list.some(v => isNaN(v))) return false;
|
|
||||||
const [r, g, b, a] = list;
|
|
||||||
if ([r, g, b].some(v => v < 0 || v > 255) || a < 0 || a > 1) return false;
|
|
||||||
return true;
|
|
||||||
}
|
}
|
||||||
},
|
},
|
||||||
|
|
||||||
|
|
Loading…
Reference in New Issue