|
|
|
@ -23,19 +23,17 @@ import { Single, Editor } from "@/base";
|
|
|
|
|
import { AccurateCalculationModel } from "./model.accuratecalculation"; |
|
|
|
|
import { SignTextEditor, SliderIconButton } from "../singleslider"; |
|
|
|
|
|
|
|
|
|
@shortcut() |
|
|
|
|
export class IntervalSlider extends Single { |
|
|
|
|
static xtype = "bi.interval_slider"; |
|
|
|
|
_constant = { |
|
|
|
|
const CONSTANTS = { |
|
|
|
|
EDITOR_WIDTH: 58, |
|
|
|
|
EDITOR_R_GAP: 60, |
|
|
|
|
EDITOR_HEIGHT: 20, |
|
|
|
|
SLIDER_WIDTH_HALF: 15, |
|
|
|
|
LABEL_HEIGHT: 30, |
|
|
|
|
SLIDER_WIDTH: 30, |
|
|
|
|
SLIDER_HEIGHT: 30, |
|
|
|
|
TRACK_HEIGHT: 24, |
|
|
|
|
}; |
|
|
|
|
}; |
|
|
|
|
|
|
|
|
|
@shortcut() |
|
|
|
|
export class IntervalSlider extends Single { |
|
|
|
|
static xtype = "bi.interval_slider"; |
|
|
|
|
|
|
|
|
|
props = { |
|
|
|
|
baseCls: "bi-interval-slider bi-slider-track", |
|
|
|
|
digit: false, |
|
|
|
@ -45,6 +43,8 @@ export class IntervalSlider extends Single {
|
|
|
|
|
value: { min: "", max: "" }, |
|
|
|
|
lAlign: "center", |
|
|
|
|
rAlign: "center", |
|
|
|
|
labelHeight: CONSTANTS.LABEL_HEIGHT, |
|
|
|
|
sliderHeight: CONSTANTS.SLIDER_HEIGHT, |
|
|
|
|
}; |
|
|
|
|
|
|
|
|
|
static EVENT_CHANGE = "EVENT_CHANGE"; |
|
|
|
@ -59,8 +59,11 @@ export class IntervalSlider extends Single {
|
|
|
|
|
this.populate(); |
|
|
|
|
} |
|
|
|
|
|
|
|
|
|
getConstant() { |
|
|
|
|
return CONSTANTS; |
|
|
|
|
} |
|
|
|
|
|
|
|
|
|
render() { |
|
|
|
|
const c = this._constant; |
|
|
|
|
const o = this.options; |
|
|
|
|
this.enable = false; |
|
|
|
|
this.valueOne = ""; |
|
|
|
@ -86,8 +89,8 @@ export class IntervalSlider extends Single {
|
|
|
|
|
text: unit, |
|
|
|
|
allowBlank: false, |
|
|
|
|
textAlign: lAlign, |
|
|
|
|
width: BI.isNull(editorWidth) ? BI.toPix(c.EDITOR_WIDTH, 2) : BI.toPix(editorWidth, 2), |
|
|
|
|
height: toPix(c.EDITOR_HEIGHT, 2), |
|
|
|
|
width: isNull(editorWidth) ? toPix(CONSTANTS.EDITOR_WIDTH, 2) : toPix(editorWidth, 2), |
|
|
|
|
height: toPix(CONSTANTS.EDITOR_HEIGHT, 2), |
|
|
|
|
validationChecker: v => this._checkValidation(v), |
|
|
|
|
}); |
|
|
|
|
this.labelOne.element.hover( |
|
|
|
@ -116,8 +119,8 @@ export class IntervalSlider extends Single {
|
|
|
|
|
text: unit, |
|
|
|
|
allowBlank: false, |
|
|
|
|
textAlign: rAlign, |
|
|
|
|
width: BI.isNull(editorWidth) ? BI.toPix(c.EDITOR_WIDTH, 2) : BI.toPix(editorWidth, 2), |
|
|
|
|
height: toPix(c.EDITOR_HEIGHT, 2), |
|
|
|
|
width: isNull(editorWidth) ? toPix(CONSTANTS.EDITOR_WIDTH, 2) : toPix(editorWidth, 2), |
|
|
|
|
height: toPix(CONSTANTS.EDITOR_HEIGHT, 2), |
|
|
|
|
validationChecker: v => this._checkValidation(v), |
|
|
|
|
}); |
|
|
|
|
this.labelTwo.element.hover( |
|
|
|
@ -152,7 +155,7 @@ export class IntervalSlider extends Single {
|
|
|
|
|
|
|
|
|
|
return { |
|
|
|
|
type: VerticalFillLayout.xtype, |
|
|
|
|
rowSize: [o.labelHeight || c.LABEL_HEIGHT, o.sliderHeight || c.SLIDER_HEIGHT], |
|
|
|
|
rowSize: [o.labelHeight, o.sliderHeight], |
|
|
|
|
items: [ |
|
|
|
|
this._createLabelWrapper(), |
|
|
|
|
{ |
|
|
|
@ -253,7 +256,6 @@ export class IntervalSlider extends Single {
|
|
|
|
|
|
|
|
|
|
_createLabelWrapper() { |
|
|
|
|
const o = this.options; |
|
|
|
|
const c = this._constant; |
|
|
|
|
|
|
|
|
|
return { |
|
|
|
|
el: { |
|
|
|
@ -275,7 +277,7 @@ export class IntervalSlider extends Single {
|
|
|
|
|
], |
|
|
|
|
}, |
|
|
|
|
], |
|
|
|
|
height: o.labelHeight || c.LABEL_HEIGHT, |
|
|
|
|
height: o.labelHeight, |
|
|
|
|
}, |
|
|
|
|
top: 0, |
|
|
|
|
left: 0, |
|
|
|
@ -372,24 +374,6 @@ export class IntervalSlider extends Single {
|
|
|
|
|
return valid; |
|
|
|
|
} |
|
|
|
|
|
|
|
|
|
_checkOverlap() { |
|
|
|
|
const labelOneLeft = this.labelOne.element[0].offsetLeft; |
|
|
|
|
const labelTwoLeft = this.labelTwo.element[0].offsetLeft; |
|
|
|
|
if (labelOneLeft <= labelTwoLeft) { |
|
|
|
|
if (labelTwoLeft - labelOneLeft < 90) { |
|
|
|
|
this.labelTwo.element.css({ top: 40 }); |
|
|
|
|
} else { |
|
|
|
|
this.labelTwo.element.css({ top: 0 }); |
|
|
|
|
} |
|
|
|
|
} else { |
|
|
|
|
if (labelOneLeft - labelTwoLeft < 90) { |
|
|
|
|
this.labelTwo.element.css({ top: 40 }); |
|
|
|
|
} else { |
|
|
|
|
this.labelTwo.element.css({ top: 0 }); |
|
|
|
|
} |
|
|
|
|
} |
|
|
|
|
} |
|
|
|
|
|
|
|
|
|
_checkLabelPosition(oldValueOne, oldValueTwo, valueOne, valueTwo, isLeft) { |
|
|
|
|
oldValueOne = parseFloat(oldValueOne); |
|
|
|
|
oldValueTwo = parseFloat(oldValueTwo); |
|
|
|
|