Browse Source

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

* commit '48f25bb60cf84facf0d3c008e0cac269e71af791':
  JSY-30724 feat:区间滑块支持自定义编辑框的宽度
  JSY-30724 feat:区间滑块支持自定义编辑框的宽度
master
superman 1 year ago
parent
commit
5d995e001f
  1. 38
      packages/fineui/src/widget/intervalslider/intervalslider.js

38
packages/fineui/src/widget/intervalslider/intervalslider.js

@ -42,6 +42,8 @@ export class IntervalSlider extends Single {
min: 0,
max: 100,
value: { min: "", max: "" },
lAlign: "center",
rAlign: "center",
};
static EVENT_CHANGE = "EVENT_CHANGE";
@ -61,6 +63,7 @@ export class IntervalSlider extends Single {
this.enable = false;
this.valueOne = "";
this.valueTwo = "";
const { unit, lAlign, rAlign, editorWidth } = this.options;
this.calculation = new AccurateCalculationModel();
this.grayTrack = createWidget({
@ -78,9 +81,10 @@ export class IntervalSlider extends Single {
this.labelOne = createWidget({
type: SignTextEditor.xtype,
cls: "slider-editor-button",
text: this.options.unit,
text: unit,
allowBlank: false,
width: toPix(c.EDITOR_WIDTH, 2),
textAlign: lAlign,
width: BI.isNull(editorWidth) ? BI.toPix(c.EDITOR_WIDTH, 2) : BI.toPix(editorWidth, 2),
height: toPix(c.EDITOR_HEIGHT, 2),
validationChecker: v => this._checkValidation(v),
});
@ -107,9 +111,10 @@ export class IntervalSlider extends Single {
this.labelTwo = createWidget({
type: SignTextEditor.xtype,
cls: "slider-editor-button",
text: this.options.unit,
text: unit,
allowBlank: false,
width: toPix(c.EDITOR_WIDTH, 2),
textAlign: rAlign,
width: BI.isNull(editorWidth) ? BI.toPix(c.EDITOR_WIDTH, 2) : BI.toPix(editorWidth, 2),
height: toPix(c.EDITOR_HEIGHT, 2),
validationChecker: v => this._checkValidation(v),
});
@ -258,21 +263,15 @@ export class IntervalSlider extends Single {
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,
},
top: 0,
@ -403,8 +402,17 @@ export class IntervalSlider extends Single {
}
_resetLabelPosition(needReverse) {
this.labelOne.element.css({ left: needReverse ? "100%" : "0%" });
this.labelTwo.element.css({ left: needReverse ? "0%" : "100%" });
const { lAlign, rAlign } = this.options;
this.labelOne.element.css({
left: needReverse ? "unset" : "0%",
right: needReverse ? "0%" : "unset",
});
this.labelOne.element.children()[0] && (this.labelOne.element.children()[0].style.textAlign = needReverse ? rAlign : lAlign);
this.labelTwo.element.css({
left: needReverse ? "0%" : "unset",
right: needReverse ? "unset" : "0%",
});
this.labelTwo.element.children()[0] && (this.labelTwo.element.children()[0].style.textAlign = needReverse ? lAlign : rAlign);
}
_setSliderOnePosition(percent) {

Loading…
Cancel
Save