fanruan
/
fineui
4
1
Fork 3
Code Issues 1 Pull Requests Releases Wiki Activity
Browse Source

silder

es6
imp 7 years ago
parent
19e10b61fb
commit
c47a3916ea
15 changed files with 13559 additions and 14340 deletions
Whitespace
Show all changes Ignore whitespace when comparing lines Ignore changes in amount of whitespace Ignore changes in whitespace at EOL
Unified View
Diff Options
Show Stats Download Patch File Download Diff File
  1. 16
      Gruntfile.js
  2. 5952
      bi/jqueryui.js
  3. 6533
      bi/slider.js
  4. 796
      bi/widget.js
  5. 796
      dist/bundle.js
  6. 216
      dist/demo.js
  7. 1
      dist/index.html
  8. 5952
      dist/jqueryui.js
  9. 6533
      dist/slider.js
  10. 796
      dist/widget.js
  11. 0
      src/addons/slider/slider/singleslider/button/iconbutton.slider.js
  12. 0
      src/addons/slider/slider/singleslider/singleslider.js
  13. 0
      src/addons/slider/slider/singleslider/singleslider.normal.js
  14. 0
      src/addons/slider/slider/slider.button.js
  15. 0
      src/addons/slider/slider/slider.js

16
Gruntfile.js
Unescape View File

@ -82,6 +82,12 @@ module.exports = function (grunt) {
dest: 'dist/chart.js' dest: 'dist/chart.js'
}, },
sliderJs: { sliderJs: {
src: [
'src/addons/slider/slider/**/*.js'
],
dest: 'dist/slider.js'
},
jqueryuiJs: {
src: [ src: [
'src/addons/slider/lib/jquery.ui.core.js', 'src/addons/slider/lib/jquery.ui.core.js',
'src/addons/slider/lib/jquery.ui.core.js', 'src/addons/slider/lib/jquery.ui.core.js',
@ -93,7 +99,7 @@ module.exports = function (grunt) {
'src/addons/slider/lib/jquery.ui.droppable.js', 'src/addons/slider/lib/jquery.ui.droppable.js',
'src/addons/slider/lib/jquery.ui.sortable.js' 'src/addons/slider/lib/jquery.ui.sortable.js'
], ],
dest: 'dist/slider.js' dest: 'dist/jqueryui.js'
}, },
coreCss: { coreCss: {
src: ['src/css/core/**/*.css', 'src/css/theme/**/*.css'], src: ['src/css/core/**/*.css', 'src/css/theme/**/*.css'],
@ -219,6 +225,12 @@ module.exports = function (grunt) {
dest: 'bi/chart.js' dest: 'bi/chart.js'
}, },
bi_sliderJs: { bi_sliderJs: {
src: [
'src/addons/slider/slider/**/*.js'
],
dest: 'bi/slider.js'
},
bi_jqueryuiJs: {
src: [ src: [
'src/addons/slider/lib/jquery.ui.core.js', 'src/addons/slider/lib/jquery.ui.core.js',
'src/addons/slider/lib/jquery.ui.core.js', 'src/addons/slider/lib/jquery.ui.core.js',
@ -230,7 +242,7 @@ module.exports = function (grunt) {
'src/addons/slider/lib/jquery.ui.droppable.js', 'src/addons/slider/lib/jquery.ui.droppable.js',
'src/addons/slider/lib/jquery.ui.sortable.js' 'src/addons/slider/lib/jquery.ui.sortable.js'
], ],
dest: 'bi/slider.js' dest: 'bi/jqueryui.js'
}, },
bi_coreCss: { bi_coreCss: {
src: ['src/css/core/**/*.css', 'src/css/theme/**/*.css'], src: ['src/css/core/**/*.css', 'src/css/theme/**/*.css'],

5952
bi/jqueryui.js vendored
View File

File diff suppressed because it is too large Load Diff

6533
bi/slider.js
View File

File diff suppressed because it is too large Load Diff

796
bi/widget.js
Unescape View File

@ -15999,802 +15999,6 @@ BI.SingleTreeTrigger = BI.inherit(BI.Trigger, {
}); });
BI.shortcut("bi.single_tree_trigger", BI.SingleTreeTrigger);/** BI.shortcut("bi.single_tree_trigger", BI.SingleTreeTrigger);/**
* Created by zcf on 2016/9/22.
*/
BI.Slider = BI.inherit(BI.Widget, {
_defaultConfig: function () {
return BI.extend(BI.Slider.superclass._defaultConfig.apply(this, arguments), {
baseCls: "bi-single-button-button"
});
},
_init: function () {
BI.extend(BI.Slider.superclass._init.apply(this, arguments));
this.slider = BI.createWidget({
type: "bi.icon_button",
cls: "widget-button-icon button-button",
iconWidth: 14,
iconHeight: 14,
height: 14,
width: 14
});
BI.createWidget({
type: "bi.absolute",
element: this,
items: [{
el: this.slider,
top: 7,
left: -7
}],
width: 0,
height: 14
});
}
});
BI.shortcut("bi.single_slider_slider", BI.Slider);/**
* Created by zcf on 2016/9/22.
*/
BI.SingleSlider = BI.inherit(BI.Widget, {
_constant: {
EDITOR_WIDTH: 90,
EDITOR_HEIGHT: 30,
HEIGHT: 28,
SLIDER_WIDTH_HALF: 15,
SLIDER_WIDTH: 30,
SLIDER_HEIGHT: 30,
TRACK_HEIGHT: 24
},
_defaultConfig: function () {
return BI.extend(BI.SingleSlider.superclass._defaultConfig.apply(this, arguments), {
baseCls: "bi-single-button bi-button-track"
});
},
_init: function () {
BI.SingleSlider.superclass._init.apply(this, arguments);
var self = this;
var c = this._constant;
this.enable = false;
this.value = "";
this.grayTrack = BI.createWidget({
type: "bi.layout",
cls: "gray-track",
height: 6
});
this.blueTrack = BI.createWidget({
type: "bi.layout",
cls: "blue-track bi-high-light-background",
height: 6
});
this.track = this._createTrackWrapper();
this.slider = BI.createWidget({
type: "bi.single_slider_slider"
});
this.slider.element.draggable({
axis: "x",
containment: this.grayTrack.element,
scroll: false,
drag: function (e, ui) {
var percent = (ui.position.left) * 100 / (self._getGrayTrackLength());
var significantPercent = BI.parseFloat(percent.toFixed(1));//直接对计算出来的百分数保留到小数点后一位，相当于分成了1000份。
self._setBlueTrack(significantPercent);
self._setLabelPosition(significantPercent);
var v = self._getValueByPercent(significantPercent);
self.label.setValue(v);
self.value = v;
},
stop: function (e, ui) {
var percent = (ui.position.left) * 100 / (self._getGrayTrackLength());
var significantPercent = BI.parseFloat(percent.toFixed(1));
self._setSliderPosition(significantPercent);
self.fireEvent(BI.SingleSlider.EVENT_CHANGE);
}
});
var sliderVertical = BI.createWidget({
type: "bi.vertical",
items: [{
type: "bi.absolute",
items: [this.slider]
}],
hgap: c.SLIDER_WIDTH_HALF,
height: c.SLIDER_HEIGHT
});
sliderVertical.element.click(function (e) {
if (self.enable) {
var offset = e.clientX - self.element.offset().left - c.SLIDER_WIDTH_HALF;
var trackLength = self.track.element[0].scrollWidth;
var percent = 0;
if (offset < 0) {
percent = 0
}
if (offset > 0 && offset < (trackLength - c.SLIDER_WIDTH)) {
percent = offset * 100 / self._getGrayTrackLength();
}
if (offset > (trackLength - c.SLIDER_WIDTH)) {
percent = 100
}
var significantPercent = BI.parseFloat(percent.toFixed(1));
self._setAllPosition(significantPercent);
var v = self._getValueByPercent(significantPercent);
self.label.setValue(v);
self.value = v;
self.fireEvent(BI.SingleSlider.EVENT_CHANGE);
}
});
this.label = BI.createWidget({
type: "bi.sign_editor",
cls: "button-editor-button bi-border",
errorText: "",
height: c.HEIGHT,
width: c.EDITOR_WIDTH,
allowBlank: false,
validationChecker: function (v) {
return self._checkValidation(v);
},
quitChecker: function (v) {
return self._checkValidation(v);
}
});
this.label.on(BI.SignEditor.EVENT_CONFIRM, function () {
var percent = self._getPercentByValue(this.getValue());
var significantPercent = BI.parseFloat(percent.toFixed(1));
self._setAllPosition(significantPercent);
self.fireEvent(BI.SingleSlider.EVENT_CHANGE);
});
this._setVisible(false);
BI.createWidget({
type: "bi.absolute",
element: this,
items: [{
el: {
type: "bi.vertical",
items: [{
type: "bi.absolute",
items: [{
el: this.track,
width: "100%",
height: c.TRACK_HEIGHT
}]
}],
hgap: 7,
height: c.TRACK_HEIGHT
},
top: 33,
left: 0,
width: "100%"
}, {
el: sliderVertical,
top: 30,
left: 0,
width: "100%"
}, {
el: {
type: "bi.vertical",
items: [{
type: "bi.absolute",
items: [this.label]
}],
rgap: c.EDITOR_WIDTH,
height: c.EDITOR_HEIGHT
},
top: 0,
left: 0,
width: "100%"
}]
})
},
_createTrackWrapper: function () {
return BI.createWidget({
type: "bi.absolute",
items: [{
el: {
type: "bi.vertical",
items: [{
type: "bi.absolute",
items: [{
el: this.grayTrack,
top: 0,
left: 0,
width: "100%"
}, {
el: this.blueTrack,
top: 0,
left: 0,
width: "0%"
}]
}],
hgap: 8,
height: 8
},
top: 8,
left: 0,
width: "100%"
}]
})
},
_checkValidation: function (v) {
return !(BI.isNull(v) || v < this.min || v > this.max)
},
_setBlueTrack: function (percent) {
this.blueTrack.element.css({"width": percent + "%"});
},
_setLabelPosition: function (percent) {
this.label.element.css({"left": percent + "%"});
},
_setSliderPosition: function (percent) {
this.slider.element.css({"left": percent + "%"});
},
_setAllPosition: function (percent) {
this._setSliderPosition(percent);
this._setLabelPosition(percent);
this._setBlueTrack(percent);
},
_setVisible: function (visible) {
this.slider.setVisible(visible);
this.label.setVisible(visible);
},
_getGrayTrackLength: function () {
return this.grayTrack.element[0].scrollWidth
},
_getValueByPercent: function (percent) {
var thousandth = BI.parseInt(percent * 10);
return (((this.max - this.min) * thousandth) / 1000 + this.min);
},
_getPercentByValue: function (v) {
return (v - this.min) * 100 / (this.max - this.min);
},
getValue: function () {
return this.value;
},
setValue: function (v) {
var value = BI.parseFloat(v);
if ((!isNaN(value))) {
if (this._checkValidation(value)) {
this.value = value;
}
if (value > this.max) {
this.value = this.max;
}
if (value < this.min) {
this.value = this.min;
}
}
},
setMinAndMax: function (v) {
var minNumber = BI.parseFloat(v.min);
var maxNumber = BI.parseFloat(v.max);
if ((!isNaN(minNumber)) && (!isNaN(maxNumber)) && (maxNumber > minNumber )) {
this.min = minNumber;
this.max = maxNumber;
}
},
reset: function () {
this._setVisible(false);
this.enable = false;
this.value = "";
this.min = 0;
this.max = 0;
this._setBlueTrack(0);
},
populate: function () {
if (!isNaN(this.min) && !isNaN(this.max)) {
this._setVisible(true);
this.enable = true;
this.label.setErrorText(BI.i18nText("BI-Please_Enter") + this.min + "-" + this.max + BI.i18nText("BI-Basic_De") + BI.i18nText("BI-Basic_Number"));
if (BI.isNumeric(this.value) || BI.isNotEmptyString(this.value)) {
this.label.setValue(this.value);
this._setAllPosition(this._getPercentByValue(this.value));
} else {
this.label.setValue(this.max);
this._setAllPosition(100);
}
}
}
});
BI.SingleSlider.EVENT_CHANGE = "EVENT_CHANGE";
BI.shortcut("bi.single_slider", BI.SingleSlider);/**
* normal single slider
* Created by Young on 2017/6/21.
*/
BI.SingleSliderNormal = BI.inherit(BI.Widget, {
_constant: {
EDITOR_WIDTH: 90,
EDITOR_HEIGHT: 30,
HEIGHT: 28,
SLIDER_WIDTH_HALF: 15,
SLIDER_WIDTH: 30,
SLIDER_HEIGHT: 30,
TRACK_HEIGHT: 24
},
props: {
baseCls: "bi-single-button bi-button-track",
minMax: {
min: 0,
max: 100
},
color: "#3f8ce8"
},
render: function () {
var self = this;
var c = this._constant;
var track = this._createTrack();
this.slider = BI.createWidget({
type: "bi.single_slider_slider"
});
this.slider.element.draggable({
axis: "x",
containment: this.grayTrack.element,
scroll: false,
drag: function (e, ui) {
var percent = (ui.position.left) * 100 / (self._getGrayTrackLength());
var significantPercent = BI.parseFloat(percent.toFixed(1));//直接对计算出来的百分数保留到小数点后一位，相当于分成了1000份。
self._setBlueTrack(significantPercent);
var v = self._getValueByPercent(significantPercent);
self.value = v;
self.fireEvent(BI.SingleSliderNormal.EVENT_DRAG, v);
},
stop: function (e, ui) {
var percent = (ui.position.left) * 100 / (self._getGrayTrackLength());
var significantPercent = BI.parseFloat(percent.toFixed(1));
self._setSliderPosition(significantPercent);
self.fireEvent(BI.SingleSlider.EVENT_CHANGE);
}
});
var sliderVertical = BI.createWidget({
type: "bi.vertical",
items: [{
type: "bi.absolute",
items: [this.slider]
}],
hgap: c.SLIDER_WIDTH_HALF,
height: c.SLIDER_HEIGHT
});
sliderVertical.element.click(function (e) {
if (self.enable) {
var offset = e.clientX - self.element.offset().left - c.SLIDER_WIDTH_HALF;
var trackLength = self.track.element[0].scrollWidth;
var percent = 0;
if (offset < 0) {
percent = 0
}
if (offset > 0 && offset < (trackLength - c.SLIDER_WIDTH)) {
percent = offset * 100 / self._getGrayTrackLength();
}
if (offset > (trackLength - c.SLIDER_WIDTH)) {
percent = 100
}
var significantPercent = BI.parseFloat(percent.toFixed(1));
self._setAllPosition(significantPercent);
var v = self._getValueByPercent(significantPercent);
self.value = v;
self.fireEvent(BI.SingleSlider.EVENT_CHANGE);
}
});
return {
type: "bi.absolute",
element: this,
items: [{
el: {
type: "bi.vertical",
items: [{
type: "bi.absolute",
items: [{
el: track,
width: "100%",
height: c.TRACK_HEIGHT
}]
}],
hgap: 7,
height: c.TRACK_HEIGHT
},
top: 3,
left: 0,
width: "100%"
}, {
el: sliderVertical,
top: 0,
left: 0,
width: "100%"
}]
}
},
_createTrack: function () {
var self = this;
var c = this._constant;
this.grayTrack = BI.createWidget({
type: "bi.layout",
cls: "gray-track",
height: 6
});
this.blueTrack = BI.createWidget({
type: "bi.layout",
cls: "blue-track",
height: 6
});
this.blueTrack.element.css({"background-color": this.options.color});
return {
type: "bi.absolute",
items: [{
el: {
type: "bi.vertical",
items: [{
type: "bi.absolute",
items: [{
el: this.grayTrack,
top: 0,
left: 0,
width: "100%"
}, {
el: this.blueTrack,
top: 0,
left: 0,
width: "0%"
}]
}],
hgap: 8,
height: 8
},
top: 8,
left: 0,
width: "100%"
}],
ref: function (ref) {
self.track = ref;
}
}
},
_checkValidation: function (v) {
return !(BI.isNull(v) || v < this.min || v > this.max)
},
_setBlueTrack: function (percent) {
this.blueTrack.element.css({"width": percent + "%"});
},
_setSliderPosition: function (percent) {
this.slider.element.css({"left": percent + "%"});
},
_setAllPosition: function (percent) {
this._setSliderPosition(percent);
this._setBlueTrack(percent);
},
_setVisible: function (visible) {
this.slider.setVisible(visible);
},
_getGrayTrackLength: function () {
return this.grayTrack.element[0].scrollWidth
},
_getValueByPercent: function (percent) {
var thousandth = BI.parseInt(percent * 10);
return (((this.max - this.min) * thousandth) / 1000 + this.min);
},
_getPercentByValue: function (v) {
return (v - this.min) * 100 / (this.max - this.min);
},
getValue: function () {
return this.value;
},
setValue: function (v) {
var value = BI.parseFloat(v);
if ((!isNaN(value))) {
if (this._checkValidation(value)) {
this.value = value;
}
if (value > this.max) {
this.value = this.max;
}
if (value < this.min) {
this.value = this.min;
}
}
},
setMinAndMax: function (v) {
var minNumber = BI.parseFloat(v.min);
var maxNumber = BI.parseFloat(v.max);
if ((!isNaN(minNumber)) && (!isNaN(maxNumber)) && (maxNumber > minNumber )) {
this.min = minNumber;
this.max = maxNumber;
}
},
reset: function () {
this._setVisible(false);
this.enable = false;
this.value = "";
this.min = 0;
this.max = 0;
this._setBlueTrack(0);
},
populate: function () {
if (!isNaN(this.min) && !isNaN(this.max)) {
this._setVisible(true);
this.enable = true;
if (BI.isNumeric(this.value) || BI.isNotEmptyString(this.value)) {
this._setAllPosition(this._getPercentByValue(this.value));
} else {
this._setAllPosition(100);
}
}
}
});
BI.SingleSliderNormal.EVENT_DRAG = "EVENT_DRAG";
BI.shortcut("bi.single_slider_normal", BI.SingleSliderNormal);/**
* Created by Urthur on 2017/9/4.
*/
BI.SliderButton = BI.inherit(BI.Widget, {
_defaultConfig: function () {
return BI.extend(BI.SliderButton.superclass._defaultConfig.apply(this, arguments), {
baseCls: "bi-slider-button"
});
},
_init: function () {
BI.extend(BI.SliderButton.superclass._init.apply(this, arguments));
var self = this;
var sliderButton = BI.createWidget({
type: "bi.icon_button",
cls: "column-next-page-h-font",
iconWidth: 16,
iconHeight: 16,
height: 16,
width: 16
});
BI.createWidget({
type: "bi.absolute",
element: this,
items: [{
el: sliderButton,
left: -8
}, {
el: {
type: "bi.label",
ref: function (_ref) {
self.label = _ref;
}
},
left: -8,
top: -10
}]
});
},
setValue: function (v) {
this.label.setText(v);
}
});
BI.shortcut("bi.slider_button", BI.SliderButton);/**
* Created by Urthur on 2017/9/4.
*/
BI.SliderNormal = BI.inherit(BI.Widget, {
_constant: {
HEIGHT: 28,
SLIDER_WIDTH_HALF: 10,
SLIDER_WIDTH: 25,
SLIDER_HEIGHT: 30,
TRACK_HEIGHT: 24
},
_defaultConfig: function () {
return BI.extend(BI.SliderNormal.superclass._defaultConfig.apply(this, arguments), {
baseCls: "bi-slider",
min: 10,
max: 50
})
},
_init: function () {
BI.SliderNormal.superclass._init.apply(this, arguments);
var self = this;
var c = this._constant, o = this.options;
this.enable = false;
this.value = o.min;
this.min = o.min;
this.max = o.max;
this.rightTrack = BI.createWidget({
type: "bi.layout",
cls: "bi-slider-track",
height: 5
});
this.track = this._createTrack();
this.slider = BI.createWidget({
type: "bi.slider_button"
});
this.slider.setValue(this.getValue());
this.slider.element.draggable({
axis: "x",
containment: this.rightTrack.element,
scroll: false,
drag: function (e, ui) {
var percent = (ui.position.left) * 100 / (self._getRightTrackLength());
var significantPercent = BI.parseFloat(percent.toFixed(1));//直接对计算出来的百分数保留到小数点后一位，相当于分成了1000份。
var v = self._getValueByPercent(significantPercent);
self.value = BI.parseInt(v) + 1;
self.slider.setValue(self.getValue());
self.fireEvent(BI.SliderNormal.EVENT_CHANGE);
},
stop: function (e, ui) {
var percent = (ui.position.left) * 100 / (self._getRightTrackLength());
var significantPercent = BI.parseFloat(percent.toFixed(1));
self._setSliderPosition(significantPercent);
self.fireEvent(BI.SliderNormal.EVENT_CHANGE);
}
});
var sliderVertical = BI.createWidget({
type: "bi.vertical",
items: [{
type: "bi.absolute",
items: [{
el: this.slider,
top: 10
}]
}],
hgap: c.SLIDER_WIDTH_HALF,
height: c.SLIDER_HEIGHT
});
sliderVertical.element.click(function (e) {
if (self.enable) {
var offset = e.clientX - self.element.offset().left - c.SLIDER_WIDTH_HALF;
var trackLength = self.track.element[0].scrollWidth;
var percent = 0;
if (offset < 0) {
percent = 0
}
if (offset > 0 && offset < (trackLength - c.SLIDER_WIDTH)) {
percent = offset * 100 / self._getRightTrackLength();
}
if (offset > (trackLength - c.SLIDER_WIDTH)) {
percent = 100
}
var significantPercent = BI.parseFloat(percent.toFixed(1));
self._setSliderPosition(significantPercent);
var v = self._getValueByPercent(significantPercent);
self.value = BI.parseInt(v);
self.slider.setValue(self.getValue());
self.fireEvent(BI.SliderNormal.EVENT_CHANGE);
}
});
BI.createWidget({
type: "bi.absolute",
element: this,
items: [{
el: {
type: "bi.vertical",
items: [{
type: "bi.absolute",
items: [{
el: this.track,
width: "100%",
height: c.TRACK_HEIGHT
}]
}],
height: c.TRACK_HEIGHT
},
top: 33,
left: 0,
width: "100%"
}, {
el: sliderVertical,
top: 15,
left: 0,
width: "100%"
}]
});
},
_createTrack: function () {
return BI.createWidget({
type: "bi.absolute",
items: [{
el: {
type: "bi.vertical",
items: [{
type: "bi.absolute",
items: [{
el: this.rightTrack,
top: 0,
left: 0,
width: "100%"
}]
}],
hgap: 8,
height: 5
},
top: 5,
left: 0,
width: "100%"
}]
})
},
_checkValidation: function (v) {
return !(BI.isNull(v) || v < this.min || v > this.max)
},
_setSliderPosition: function (percent) {
this.slider.element.css({"left": percent + "%"});
},
_getRightTrackLength: function () {
return this.rightTrack.element[0].scrollWidth
},
_getValueByPercent: function (percent) {
var thousandth = BI.parseInt(percent * 10);
return (((this.max - this.min) * thousandth) / 1000 + this.min);
},
_getPercentByValue: function (v) {
return (v - this.min) * 100 / (this.max - this.min);
},
getValue: function () {
return this.value;
},
setValue: function (v) {
var value = BI.parseFloat(v);
if ((!isNaN(value))) {
if (this._checkValidation(value)) {
this.value = value;
}
if (value > this.max) {
this.value = this.max;
}
if (value < this.min) {
this.value = this.min;
}
}
if (!isNaN(this.min) && !isNaN(this.max)) {
this.enable = true;
if (BI.isNumeric(this.value) || BI.isNotEmptyString(this.value)) {
this.slider.setValue(BI.parseInt(this.value));
this._setSliderPosition(this._getPercentByValue(this.value));
} else {
this.slider.setValue(this.max);
this._setSliderPosition(100);
}
}
}
});
BI.SliderNormal.EVENT_CHANGE = "EVENT_CHANGE";
BI.shortcut("bi.slider", BI.SliderNormal);/**
* 可以单选多选切换的树 * 可以单选多选切换的树
* *
* Created by GUY on 2015/12/21. * Created by GUY on 2015/12/21.

796
dist/bundle.js vendored
Unescape View File

@ -93075,802 +93075,6 @@ BI.SingleTreeTrigger = BI.inherit(BI.Trigger, {
}); });
BI.shortcut("bi.single_tree_trigger", BI.SingleTreeTrigger);/** BI.shortcut("bi.single_tree_trigger", BI.SingleTreeTrigger);/**
* Created by zcf on 2016/9/22.
*/
BI.Slider = BI.inherit(BI.Widget, {
_defaultConfig: function () {
return BI.extend(BI.Slider.superclass._defaultConfig.apply(this, arguments), {
baseCls: "bi-single-button-button"
});
},
_init: function () {
BI.extend(BI.Slider.superclass._init.apply(this, arguments));
this.slider = BI.createWidget({
type: "bi.icon_button",
cls: "widget-button-icon button-button",
iconWidth: 14,
iconHeight: 14,
height: 14,
width: 14
});
BI.createWidget({
type: "bi.absolute",
element: this,
items: [{
el: this.slider,
top: 7,
left: -7
}],
width: 0,
height: 14
});
}
});
BI.shortcut("bi.single_slider_slider", BI.Slider);/**
* Created by zcf on 2016/9/22.
*/
BI.SingleSlider = BI.inherit(BI.Widget, {
_constant: {
EDITOR_WIDTH: 90,
EDITOR_HEIGHT: 30,
HEIGHT: 28,
SLIDER_WIDTH_HALF: 15,
SLIDER_WIDTH: 30,
SLIDER_HEIGHT: 30,
TRACK_HEIGHT: 24
},
_defaultConfig: function () {
return BI.extend(BI.SingleSlider.superclass._defaultConfig.apply(this, arguments), {
baseCls: "bi-single-button bi-button-track"
});
},
_init: function () {
BI.SingleSlider.superclass._init.apply(this, arguments);
var self = this;
var c = this._constant;
this.enable = false;
this.value = "";
this.grayTrack = BI.createWidget({
type: "bi.layout",
cls: "gray-track",
height: 6
});
this.blueTrack = BI.createWidget({
type: "bi.layout",
cls: "blue-track bi-high-light-background",
height: 6
});
this.track = this._createTrackWrapper();
this.slider = BI.createWidget({
type: "bi.single_slider_slider"
});
this.slider.element.draggable({
axis: "x",
containment: this.grayTrack.element,
scroll: false,
drag: function (e, ui) {
var percent = (ui.position.left) * 100 / (self._getGrayTrackLength());
var significantPercent = BI.parseFloat(percent.toFixed(1));//直接对计算出来的百分数保留到小数点后一位，相当于分成了1000份。
self._setBlueTrack(significantPercent);
self._setLabelPosition(significantPercent);
var v = self._getValueByPercent(significantPercent);
self.label.setValue(v);
self.value = v;
},
stop: function (e, ui) {
var percent = (ui.position.left) * 100 / (self._getGrayTrackLength());
var significantPercent = BI.parseFloat(percent.toFixed(1));
self._setSliderPosition(significantPercent);
self.fireEvent(BI.SingleSlider.EVENT_CHANGE);
}
});
var sliderVertical = BI.createWidget({
type: "bi.vertical",
items: [{
type: "bi.absolute",
items: [this.slider]
}],
hgap: c.SLIDER_WIDTH_HALF,
height: c.SLIDER_HEIGHT
});
sliderVertical.element.click(function (e) {
if (self.enable) {
var offset = e.clientX - self.element.offset().left - c.SLIDER_WIDTH_HALF;
var trackLength = self.track.element[0].scrollWidth;
var percent = 0;
if (offset < 0) {
percent = 0
}
if (offset > 0 && offset < (trackLength - c.SLIDER_WIDTH)) {
percent = offset * 100 / self._getGrayTrackLength();
}
if (offset > (trackLength - c.SLIDER_WIDTH)) {
percent = 100
}
var significantPercent = BI.parseFloat(percent.toFixed(1));
self._setAllPosition(significantPercent);
var v = self._getValueByPercent(significantPercent);
self.label.setValue(v);
self.value = v;
self.fireEvent(BI.SingleSlider.EVENT_CHANGE);
}
});
this.label = BI.createWidget({
type: "bi.sign_editor",
cls: "button-editor-button bi-border",
errorText: "",
height: c.HEIGHT,
width: c.EDITOR_WIDTH,
allowBlank: false,
validationChecker: function (v) {
return self._checkValidation(v);
},
quitChecker: function (v) {
return self._checkValidation(v);
}
});
this.label.on(BI.SignEditor.EVENT_CONFIRM, function () {
var percent = self._getPercentByValue(this.getValue());
var significantPercent = BI.parseFloat(percent.toFixed(1));
self._setAllPosition(significantPercent);
self.fireEvent(BI.SingleSlider.EVENT_CHANGE);
});
this._setVisible(false);
BI.createWidget({
type: "bi.absolute",
element: this,
items: [{
el: {
type: "bi.vertical",
items: [{
type: "bi.absolute",
items: [{
el: this.track,
width: "100%",
height: c.TRACK_HEIGHT
}]
}],
hgap: 7,
height: c.TRACK_HEIGHT
},
top: 33,
left: 0,
width: "100%"
}, {
el: sliderVertical,
top: 30,
left: 0,
width: "100%"
}, {
el: {
type: "bi.vertical",
items: [{
type: "bi.absolute",
items: [this.label]
}],
rgap: c.EDITOR_WIDTH,
height: c.EDITOR_HEIGHT
},
top: 0,
left: 0,
width: "100%"
}]
})
},
_createTrackWrapper: function () {
return BI.createWidget({
type: "bi.absolute",
items: [{
el: {
type: "bi.vertical",
items: [{
type: "bi.absolute",
items: [{
el: this.grayTrack,
top: 0,
left: 0,
width: "100%"
}, {
el: this.blueTrack,
top: 0,
left: 0,
width: "0%"
}]
}],
hgap: 8,
height: 8
},
top: 8,
left: 0,
width: "100%"
}]
})
},
_checkValidation: function (v) {
return !(BI.isNull(v) || v < this.min || v > this.max)
},
_setBlueTrack: function (percent) {
this.blueTrack.element.css({"width": percent + "%"});
},
_setLabelPosition: function (percent) {
this.label.element.css({"left": percent + "%"});
},
_setSliderPosition: function (percent) {
this.slider.element.css({"left": percent + "%"});
},
_setAllPosition: function (percent) {
this._setSliderPosition(percent);
this._setLabelPosition(percent);
this._setBlueTrack(percent);
},
_setVisible: function (visible) {
this.slider.setVisible(visible);
this.label.setVisible(visible);
},
_getGrayTrackLength: function () {
return this.grayTrack.element[0].scrollWidth
},
_getValueByPercent: function (percent) {
var thousandth = BI.parseInt(percent * 10);
return (((this.max - this.min) * thousandth) / 1000 + this.min);
},
_getPercentByValue: function (v) {
return (v - this.min) * 100 / (this.max - this.min);
},
getValue: function () {
return this.value;
},
setValue: function (v) {
var value = BI.parseFloat(v);
if ((!isNaN(value))) {
if (this._checkValidation(value)) {
this.value = value;
}
if (value > this.max) {
this.value = this.max;
}
if (value < this.min) {
this.value = this.min;
}
}
},
setMinAndMax: function (v) {
var minNumber = BI.parseFloat(v.min);
var maxNumber = BI.parseFloat(v.max);
if ((!isNaN(minNumber)) && (!isNaN(maxNumber)) && (maxNumber > minNumber )) {
this.min = minNumber;
this.max = maxNumber;
}
},
reset: function () {
this._setVisible(false);
this.enable = false;
this.value = "";
this.min = 0;
this.max = 0;
this._setBlueTrack(0);
},
populate: function () {
if (!isNaN(this.min) && !isNaN(this.max)) {
this._setVisible(true);
this.enable = true;
this.label.setErrorText(BI.i18nText("BI-Please_Enter") + this.min + "-" + this.max + BI.i18nText("BI-Basic_De") + BI.i18nText("BI-Basic_Number"));
if (BI.isNumeric(this.value) || BI.isNotEmptyString(this.value)) {
this.label.setValue(this.value);
this._setAllPosition(this._getPercentByValue(this.value));
} else {
this.label.setValue(this.max);
this._setAllPosition(100);
}
}
}
});
BI.SingleSlider.EVENT_CHANGE = "EVENT_CHANGE";
BI.shortcut("bi.single_slider", BI.SingleSlider);/**
* normal single slider
* Created by Young on 2017/6/21.
*/
BI.SingleSliderNormal = BI.inherit(BI.Widget, {
_constant: {
EDITOR_WIDTH: 90,
EDITOR_HEIGHT: 30,
HEIGHT: 28,
SLIDER_WIDTH_HALF: 15,
SLIDER_WIDTH: 30,
SLIDER_HEIGHT: 30,
TRACK_HEIGHT: 24
},
props: {
baseCls: "bi-single-button bi-button-track",
minMax: {
min: 0,
max: 100
},
color: "#3f8ce8"
},
render: function () {
var self = this;
var c = this._constant;
var track = this._createTrack();
this.slider = BI.createWidget({
type: "bi.single_slider_slider"
});
this.slider.element.draggable({
axis: "x",
containment: this.grayTrack.element,
scroll: false,
drag: function (e, ui) {
var percent = (ui.position.left) * 100 / (self._getGrayTrackLength());
var significantPercent = BI.parseFloat(percent.toFixed(1));//直接对计算出来的百分数保留到小数点后一位，相当于分成了1000份。
self._setBlueTrack(significantPercent);
var v = self._getValueByPercent(significantPercent);
self.value = v;
self.fireEvent(BI.SingleSliderNormal.EVENT_DRAG, v);
},
stop: function (e, ui) {
var percent = (ui.position.left) * 100 / (self._getGrayTrackLength());
var significantPercent = BI.parseFloat(percent.toFixed(1));
self._setSliderPosition(significantPercent);
self.fireEvent(BI.SingleSlider.EVENT_CHANGE);
}
});
var sliderVertical = BI.createWidget({
type: "bi.vertical",
items: [{
type: "bi.absolute",
items: [this.slider]
}],
hgap: c.SLIDER_WIDTH_HALF,
height: c.SLIDER_HEIGHT
});
sliderVertical.element.click(function (e) {
if (self.enable) {
var offset = e.clientX - self.element.offset().left - c.SLIDER_WIDTH_HALF;
var trackLength = self.track.element[0].scrollWidth;
var percent = 0;
if (offset < 0) {
percent = 0
}
if (offset > 0 && offset < (trackLength - c.SLIDER_WIDTH)) {
percent = offset * 100 / self._getGrayTrackLength();
}
if (offset > (trackLength - c.SLIDER_WIDTH)) {
percent = 100
}
var significantPercent = BI.parseFloat(percent.toFixed(1));
self._setAllPosition(significantPercent);
var v = self._getValueByPercent(significantPercent);
self.value = v;
self.fireEvent(BI.SingleSlider.EVENT_CHANGE);
}
});
return {
type: "bi.absolute",
element: this,
items: [{
el: {
type: "bi.vertical",
items: [{
type: "bi.absolute",
items: [{
el: track,
width: "100%",
height: c.TRACK_HEIGHT
}]
}],
hgap: 7,
height: c.TRACK_HEIGHT
},
top: 3,
left: 0,
width: "100%"
}, {
el: sliderVertical,
top: 0,
left: 0,
width: "100%"
}]
}
},
_createTrack: function () {
var self = this;
var c = this._constant;
this.grayTrack = BI.createWidget({
type: "bi.layout",
cls: "gray-track",
height: 6
});
this.blueTrack = BI.createWidget({
type: "bi.layout",
cls: "blue-track",
height: 6
});
this.blueTrack.element.css({"background-color": this.options.color});
return {
type: "bi.absolute",
items: [{
el: {
type: "bi.vertical",
items: [{
type: "bi.absolute",
items: [{
el: this.grayTrack,
top: 0,
left: 0,
width: "100%"
}, {
el: this.blueTrack,
top: 0,
left: 0,
width: "0%"
}]
}],
hgap: 8,
height: 8
},
top: 8,
left: 0,
width: "100%"
}],
ref: function (ref) {
self.track = ref;
}
}
},
_checkValidation: function (v) {
return !(BI.isNull(v) || v < this.min || v > this.max)
},
_setBlueTrack: function (percent) {
this.blueTrack.element.css({"width": percent + "%"});
},
_setSliderPosition: function (percent) {
this.slider.element.css({"left": percent + "%"});
},
_setAllPosition: function (percent) {
this._setSliderPosition(percent);
this._setBlueTrack(percent);
},
_setVisible: function (visible) {
this.slider.setVisible(visible);
},
_getGrayTrackLength: function () {
return this.grayTrack.element[0].scrollWidth
},
_getValueByPercent: function (percent) {
var thousandth = BI.parseInt(percent * 10);
return (((this.max - this.min) * thousandth) / 1000 + this.min);
},
_getPercentByValue: function (v) {
return (v - this.min) * 100 / (this.max - this.min);
},
getValue: function () {
return this.value;
},
setValue: function (v) {
var value = BI.parseFloat(v);
if ((!isNaN(value))) {
if (this._checkValidation(value)) {
this.value = value;
}
if (value > this.max) {
this.value = this.max;
}
if (value < this.min) {
this.value = this.min;
}
}
},
setMinAndMax: function (v) {
var minNumber = BI.parseFloat(v.min);
var maxNumber = BI.parseFloat(v.max);
if ((!isNaN(minNumber)) && (!isNaN(maxNumber)) && (maxNumber > minNumber )) {
this.min = minNumber;
this.max = maxNumber;
}
},
reset: function () {
this._setVisible(false);
this.enable = false;
this.value = "";
this.min = 0;
this.max = 0;
this._setBlueTrack(0);
},
populate: function () {
if (!isNaN(this.min) && !isNaN(this.max)) {
this._setVisible(true);
this.enable = true;
if (BI.isNumeric(this.value) || BI.isNotEmptyString(this.value)) {
this._setAllPosition(this._getPercentByValue(this.value));
} else {
this._setAllPosition(100);
}
}
}
});
BI.SingleSliderNormal.EVENT_DRAG = "EVENT_DRAG";
BI.shortcut("bi.single_slider_normal", BI.SingleSliderNormal);/**
* Created by Urthur on 2017/9/4.
*/
BI.SliderButton = BI.inherit(BI.Widget, {
_defaultConfig: function () {
return BI.extend(BI.SliderButton.superclass._defaultConfig.apply(this, arguments), {
baseCls: "bi-slider-button"
});
},
_init: function () {
BI.extend(BI.SliderButton.superclass._init.apply(this, arguments));
var self = this;
var sliderButton = BI.createWidget({
type: "bi.icon_button",
cls: "column-next-page-h-font",
iconWidth: 16,
iconHeight: 16,
height: 16,
width: 16
});
BI.createWidget({
type: "bi.absolute",
element: this,
items: [{
el: sliderButton,
left: -8
}, {
el: {
type: "bi.label",
ref: function (_ref) {
self.label = _ref;
}
},
left: -8,
top: -10
}]
});
},
setValue: function (v) {
this.label.setText(v);
}
});
BI.shortcut("bi.slider_button", BI.SliderButton);/**
* Created by Urthur on 2017/9/4.
*/
BI.SliderNormal = BI.inherit(BI.Widget, {
_constant: {
HEIGHT: 28,
SLIDER_WIDTH_HALF: 10,
SLIDER_WIDTH: 25,
SLIDER_HEIGHT: 30,
TRACK_HEIGHT: 24
},
_defaultConfig: function () {
return BI.extend(BI.SliderNormal.superclass._defaultConfig.apply(this, arguments), {
baseCls: "bi-slider",
min: 10,
max: 50
})
},
_init: function () {
BI.SliderNormal.superclass._init.apply(this, arguments);
var self = this;
var c = this._constant, o = this.options;
this.enable = false;
this.value = o.min;
this.min = o.min;
this.max = o.max;
this.rightTrack = BI.createWidget({
type: "bi.layout",
cls: "bi-slider-track",
height: 5
});
this.track = this._createTrack();
this.slider = BI.createWidget({
type: "bi.slider_button"
});
this.slider.setValue(this.getValue());
this.slider.element.draggable({
axis: "x",
containment: this.rightTrack.element,
scroll: false,
drag: function (e, ui) {
var percent = (ui.position.left) * 100 / (self._getRightTrackLength());
var significantPercent = BI.parseFloat(percent.toFixed(1));//直接对计算出来的百分数保留到小数点后一位，相当于分成了1000份。
var v = self._getValueByPercent(significantPercent);
self.value = BI.parseInt(v) + 1;
self.slider.setValue(self.getValue());
self.fireEvent(BI.SliderNormal.EVENT_CHANGE);
},
stop: function (e, ui) {
var percent = (ui.position.left) * 100 / (self._getRightTrackLength());
var significantPercent = BI.parseFloat(percent.toFixed(1));
self._setSliderPosition(significantPercent);
self.fireEvent(BI.SliderNormal.EVENT_CHANGE);
}
});
var sliderVertical = BI.createWidget({
type: "bi.vertical",
items: [{
type: "bi.absolute",
items: [{
el: this.slider,
top: 10
}]
}],
hgap: c.SLIDER_WIDTH_HALF,
height: c.SLIDER_HEIGHT
});
sliderVertical.element.click(function (e) {
if (self.enable) {
var offset = e.clientX - self.element.offset().left - c.SLIDER_WIDTH_HALF;
var trackLength = self.track.element[0].scrollWidth;
var percent = 0;
if (offset < 0) {
percent = 0
}
if (offset > 0 && offset < (trackLength - c.SLIDER_WIDTH)) {
percent = offset * 100 / self._getRightTrackLength();
}
if (offset > (trackLength - c.SLIDER_WIDTH)) {
percent = 100
}
var significantPercent = BI.parseFloat(percent.toFixed(1));
self._setSliderPosition(significantPercent);
var v = self._getValueByPercent(significantPercent);
self.value = BI.parseInt(v);
self.slider.setValue(self.getValue());
self.fireEvent(BI.SliderNormal.EVENT_CHANGE);
}
});
BI.createWidget({
type: "bi.absolute",
element: this,
items: [{
el: {
type: "bi.vertical",
items: [{
type: "bi.absolute",
items: [{
el: this.track,
width: "100%",
height: c.TRACK_HEIGHT
}]
}],
height: c.TRACK_HEIGHT
},
top: 33,
left: 0,
width: "100%"
}, {
el: sliderVertical,
top: 15,
left: 0,
width: "100%"
}]
});
},
_createTrack: function () {
return BI.createWidget({
type: "bi.absolute",
items: [{
el: {
type: "bi.vertical",
items: [{
type: "bi.absolute",
items: [{
el: this.rightTrack,
top: 0,
left: 0,
width: "100%"
}]
}],
hgap: 8,
height: 5
},
top: 5,
left: 0,
width: "100%"
}]
})
},
_checkValidation: function (v) {
return !(BI.isNull(v) || v < this.min || v > this.max)
},
_setSliderPosition: function (percent) {
this.slider.element.css({"left": percent + "%"});
},
_getRightTrackLength: function () {
return this.rightTrack.element[0].scrollWidth
},
_getValueByPercent: function (percent) {
var thousandth = BI.parseInt(percent * 10);
return (((this.max - this.min) * thousandth) / 1000 + this.min);
},
_getPercentByValue: function (v) {
return (v - this.min) * 100 / (this.max - this.min);
},
getValue: function () {
return this.value;
},
setValue: function (v) {
var value = BI.parseFloat(v);
if ((!isNaN(value))) {
if (this._checkValidation(value)) {
this.value = value;
}
if (value > this.max) {
this.value = this.max;
}
if (value < this.min) {
this.value = this.min;
}
}
if (!isNaN(this.min) && !isNaN(this.max)) {
this.enable = true;
if (BI.isNumeric(this.value) || BI.isNotEmptyString(this.value)) {
this.slider.setValue(BI.parseInt(this.value));
this._setSliderPosition(this._getPercentByValue(this.value));
} else {
this.slider.setValue(this.max);
this._setSliderPosition(100);
}
}
}
});
BI.SliderNormal.EVENT_CHANGE = "EVENT_CHANGE";
BI.shortcut("bi.slider", BI.SliderNormal);/**
* 可以单选多选切换的树 * 可以单选多选切换的树
* *
* Created by GUY on 2015/12/21. * Created by GUY on 2015/12/21.

216
dist/demo.js vendored
Unescape View File

@ -4487,41 +4487,7 @@ Demo.BorderLayout = BI.inherit(BI.Widget, {
} }
} }
}); });
BI.shortcut("demo.border", Demo.BorderLayout);/** BI.shortcut("demo.border", Demo.BorderLayout);Demo.CenterAdapt = BI.inherit(BI.Widget, {
* Created by User on 2017/3/22.
*/
Demo.CenterLayout = BI.inherit(BI.Widget, {
props: {
baseCls: "demo-center"
},
render: function () {
return {
type: "bi.center",
items: [{
type: "bi.label",
text: "Center 1，这里虽然设置label的高度30，但是最终影响高度的是center布局",
cls: "layout-bg1",
whiteSpace: "normal"
},{
type: "bi.label",
text: "Center 2，为了演示label是占满整个的，用了一个whiteSpace:normal",
cls: "layout-bg2",
whiteSpace: "normal"
},{
type: "bi.label",
text: "Center 3",
cls: "layout-bg3"
},{
type: "bi.label",
text: "Center 4",
cls: "layout-bg5"
}],
hgap: 20,
vgap: 20
}
}
});
BI.shortcut("demo.center_layout", Demo.CenterLayout);Demo.CenterAdapt = BI.inherit(BI.Widget, {
props: { props: {
baseCls: "demo-absolute" baseCls: "demo-absolute"
}, },
@ -4604,6 +4570,40 @@ BI.shortcut("demo.center_layout", Demo.CenterLayout);Demo.CenterAdapt = BI.inher
BI.shortcut("demo.center_adapt", Demo.CenterAdapt);/** BI.shortcut("demo.center_adapt", Demo.CenterAdapt);/**
* Created by User on 2017/3/22. * Created by User on 2017/3/22.
*/ */
Demo.CenterLayout = BI.inherit(BI.Widget, {
props: {
baseCls: "demo-center"
},
render: function () {
return {
type: "bi.center",
items: [{
type: "bi.label",
text: "Center 1，这里虽然设置label的高度30，但是最终影响高度的是center布局",
cls: "layout-bg1",
whiteSpace: "normal"
},{
type: "bi.label",
text: "Center 2，为了演示label是占满整个的，用了一个whiteSpace:normal",
cls: "layout-bg2",
whiteSpace: "normal"
},{
type: "bi.label",
text: "Center 3",
cls: "layout-bg3"
},{
type: "bi.label",
text: "Center 4",
cls: "layout-bg5"
}],
hgap: 20,
vgap: 20
}
}
});
BI.shortcut("demo.center_layout", Demo.CenterLayout);/**
* Created by User on 2017/3/22.
*/
Demo.FloatCenterLayout = BI.inherit(BI.Widget, { Demo.FloatCenterLayout = BI.inherit(BI.Widget, {
props: { props: {
baseCls: "demo-float-center" baseCls: "demo-float-center"
@ -4848,55 +4848,6 @@ Demo.GridLayout = BI.inherit(BI.Widget, {
} }
}); });
BI.shortcut("demo.grid", Demo.GridLayout);/** BI.shortcut("demo.grid", Demo.GridLayout);/**
* Created by User on 2017/3/21.
*/
Demo.Horizontal = BI.inherit(BI.Widget, {
props: {
baseCls: "demo-horizontal"
},
render: function () {
return {
type: "bi.vertical",
items: [{
type: "bi.horizontal",
items: [{
type: "bi.absolute",
items: [{
el: {
type: "bi.text_button",
cls: "layout-bg1",
text: "这里设置了lgap(左边距)，rgap(右边距)，tgap(上边距)，bgap(下边距)这里设置了lgap(左边距)，rgap(右边距)，tgap(上边距)，bgap(下边距)",
height: 30
},
left: 0,
right: 0
}],
width: 100,
height: 30
}, {
type: "bi.absolute",
items: [{
el: {
type: "bi.text_button",
cls: "layout-bg2",
text: "这里设置了lgap(左边距)，rgap(右边距)，tgap(上边距)，bgap(下边距)这里设置了lgap(左边距)，rgap(右边距)，tgap(上边距)，bgap(下边距)",
height: 30
},
left: 0,
right: 0
}],
width: 200,
height: 30
}]
}],
lgap: 20,
rgap: 80,
tgap: 80,
bgap: 50
}
}
});
BI.shortcut("demo.horizontal", Demo.Horizontal);/**
* Created by User on 2017/3/22. * Created by User on 2017/3/22.
*/ */
Demo.HorizontalAdapt = BI.inherit(BI.Widget, { Demo.HorizontalAdapt = BI.inherit(BI.Widget, {
@ -5013,6 +4964,55 @@ Demo.HorizontalFloat = BI.inherit(BI.Widget, {
} }
}); });
BI.shortcut("demo.horizontal_float", Demo.HorizontalFloat);/** BI.shortcut("demo.horizontal_float", Demo.HorizontalFloat);/**
* Created by User on 2017/3/21.
*/
Demo.Horizontal = BI.inherit(BI.Widget, {
props: {
baseCls: "demo-horizontal"
},
render: function () {
return {
type: "bi.vertical",
items: [{
type: "bi.horizontal",
items: [{
type: "bi.absolute",
items: [{
el: {
type: "bi.text_button",
cls: "layout-bg1",
text: "这里设置了lgap(左边距)，rgap(右边距)，tgap(上边距)，bgap(下边距)这里设置了lgap(左边距)，rgap(右边距)，tgap(上边距)，bgap(下边距)",
height: 30
},
left: 0,
right: 0
}],
width: 100,
height: 30
}, {
type: "bi.absolute",
items: [{
el: {
type: "bi.text_button",
cls: "layout-bg2",
text: "这里设置了lgap(左边距)，rgap(右边距)，tgap(上边距)，bgap(下边距)这里设置了lgap(左边距)，rgap(右边距)，tgap(上边距)，bgap(下边距)",
height: 30
},
left: 0,
right: 0
}],
width: 200,
height: 30
}]
}],
lgap: 20,
rgap: 80,
tgap: 80,
bgap: 50
}
}
});
BI.shortcut("demo.horizontal", Demo.Horizontal);/**
* Created by User on 2017/3/22. * Created by User on 2017/3/22.
*/ */
Demo.HtapeLayout = BI.inherit(BI.Widget, { Demo.HtapeLayout = BI.inherit(BI.Widget, {
@ -5358,30 +5358,6 @@ Demo.TdLayout = BI.inherit(BI.Widget, {
} }
}); });
BI.shortcut("demo.td", Demo.TdLayout);/** BI.shortcut("demo.td", Demo.TdLayout);/**
* Created by User on 2017/3/21.
*/
Demo.VerticalLayout = BI.inherit(BI.Widget, {
props: {
baseCls: "demo-vertical"
},
render: function () {
return {
type: "bi.vertical",
items: [{
type: "bi.label",
cls: "layout-bg1",
text: "这里设置了hgap(水平间距)，vgap(垂直间距)",
height: 30
}, {
type: "bi.label",
cls: "layout-bg2",
text: "这里设置了hgap(水平间距)，vgap(垂直间距)",
height: 30
}]
}
}
});
BI.shortcut("demo.vertical", Demo.VerticalLayout);/**
* Created by User on 2017/3/22. * Created by User on 2017/3/22.
*/ */
Demo.VerticalAdaptLayout = BI.inherit(BI.Widget, { Demo.VerticalAdaptLayout = BI.inherit(BI.Widget, {
@ -5423,6 +5399,30 @@ Demo.VerticalAdaptLayout = BI.inherit(BI.Widget, {
} }
}); });
BI.shortcut("demo.vertical_adapt", Demo.VerticalAdaptLayout);/** BI.shortcut("demo.vertical_adapt", Demo.VerticalAdaptLayout);/**
* Created by User on 2017/3/21.
*/
Demo.VerticalLayout = BI.inherit(BI.Widget, {
props: {
baseCls: "demo-vertical"
},
render: function () {
return {
type: "bi.vertical",
items: [{
type: "bi.label",
cls: "layout-bg1",
text: "这里设置了hgap(水平间距)，vgap(垂直间距)",
height: 30
}, {
type: "bi.label",
cls: "layout-bg2",
text: "这里设置了hgap(水平间距)，vgap(垂直间距)",
height: 30
}]
}
}
});
BI.shortcut("demo.vertical", Demo.VerticalLayout);/**
* Created by User on 2017/3/22. * Created by User on 2017/3/22.
*/ */
Demo.VtapeLayout = BI.inherit(BI.Widget, { Demo.VtapeLayout = BI.inherit(BI.Widget, {

1
dist/index.html vendored
Unescape View File

@ -12,6 +12,7 @@
<script src="polyfill.js"></script> <script src="polyfill.js"></script>
<script src="core.js"></script> <script src="core.js"></script>
<script src="jqueryui.js"></script>
<script src="base.js"></script> <script src="base.js"></script>
<script src="case.js"></script> <script src="case.js"></script>
<script src="widget.js"></script> <script src="widget.js"></script>

5952
dist/jqueryui.js vendored
View File

File diff suppressed because it is too large Load Diff

6533
dist/slider.js vendored
View File

File diff suppressed because it is too large Load Diff

796
dist/widget.js vendored
Unescape View File

@ -15999,802 +15999,6 @@ BI.SingleTreeTrigger = BI.inherit(BI.Trigger, {
}); });
BI.shortcut("bi.single_tree_trigger", BI.SingleTreeTrigger);/** BI.shortcut("bi.single_tree_trigger", BI.SingleTreeTrigger);/**
* Created by zcf on 2016/9/22.
*/
BI.Slider = BI.inherit(BI.Widget, {
_defaultConfig: function () {
return BI.extend(BI.Slider.superclass._defaultConfig.apply(this, arguments), {
baseCls: "bi-single-button-button"
});
},
_init: function () {
BI.extend(BI.Slider.superclass._init.apply(this, arguments));
this.slider = BI.createWidget({
type: "bi.icon_button",
cls: "widget-button-icon button-button",
iconWidth: 14,
iconHeight: 14,
height: 14,
width: 14
});
BI.createWidget({
type: "bi.absolute",
element: this,
items: [{
el: this.slider,
top: 7,
left: -7
}],
width: 0,
height: 14
});
}
});
BI.shortcut("bi.single_slider_slider", BI.Slider);/**
* Created by zcf on 2016/9/22.
*/
BI.SingleSlider = BI.inherit(BI.Widget, {
_constant: {
EDITOR_WIDTH: 90,
EDITOR_HEIGHT: 30,
HEIGHT: 28,
SLIDER_WIDTH_HALF: 15,
SLIDER_WIDTH: 30,
SLIDER_HEIGHT: 30,
TRACK_HEIGHT: 24
},
_defaultConfig: function () {
return BI.extend(BI.SingleSlider.superclass._defaultConfig.apply(this, arguments), {
baseCls: "bi-single-button bi-button-track"
});
},
_init: function () {
BI.SingleSlider.superclass._init.apply(this, arguments);
var self = this;
var c = this._constant;
this.enable = false;
this.value = "";
this.grayTrack = BI.createWidget({
type: "bi.layout",
cls: "gray-track",
height: 6
});
this.blueTrack = BI.createWidget({
type: "bi.layout",
cls: "blue-track bi-high-light-background",
height: 6
});
this.track = this._createTrackWrapper();
this.slider = BI.createWidget({
type: "bi.single_slider_slider"
});
this.slider.element.draggable({
axis: "x",
containment: this.grayTrack.element,
scroll: false,
drag: function (e, ui) {
var percent = (ui.position.left) * 100 / (self._getGrayTrackLength());
var significantPercent = BI.parseFloat(percent.toFixed(1));//直接对计算出来的百分数保留到小数点后一位，相当于分成了1000份。
self._setBlueTrack(significantPercent);
self._setLabelPosition(significantPercent);
var v = self._getValueByPercent(significantPercent);
self.label.setValue(v);
self.value = v;
},
stop: function (e, ui) {
var percent = (ui.position.left) * 100 / (self._getGrayTrackLength());
var significantPercent = BI.parseFloat(percent.toFixed(1));
self._setSliderPosition(significantPercent);
self.fireEvent(BI.SingleSlider.EVENT_CHANGE);
}
});
var sliderVertical = BI.createWidget({
type: "bi.vertical",
items: [{
type: "bi.absolute",
items: [this.slider]
}],
hgap: c.SLIDER_WIDTH_HALF,
height: c.SLIDER_HEIGHT
});
sliderVertical.element.click(function (e) {
if (self.enable) {
var offset = e.clientX - self.element.offset().left - c.SLIDER_WIDTH_HALF;
var trackLength = self.track.element[0].scrollWidth;
var percent = 0;
if (offset < 0) {
percent = 0
}
if (offset > 0 && offset < (trackLength - c.SLIDER_WIDTH)) {
percent = offset * 100 / self._getGrayTrackLength();
}
if (offset > (trackLength - c.SLIDER_WIDTH)) {
percent = 100
}
var significantPercent = BI.parseFloat(percent.toFixed(1));
self._setAllPosition(significantPercent);
var v = self._getValueByPercent(significantPercent);
self.label.setValue(v);
self.value = v;
self.fireEvent(BI.SingleSlider.EVENT_CHANGE);
}
});
this.label = BI.createWidget({
type: "bi.sign_editor",
cls: "button-editor-button bi-border",
errorText: "",
height: c.HEIGHT,
width: c.EDITOR_WIDTH,
allowBlank: false,
validationChecker: function (v) {
return self._checkValidation(v);
},
quitChecker: function (v) {
return self._checkValidation(v);
}
});
this.label.on(BI.SignEditor.EVENT_CONFIRM, function () {
var percent = self._getPercentByValue(this.getValue());
var significantPercent = BI.parseFloat(percent.toFixed(1));
self._setAllPosition(significantPercent);
self.fireEvent(BI.SingleSlider.EVENT_CHANGE);
});
this._setVisible(false);
BI.createWidget({
type: "bi.absolute",
element: this,
items: [{
el: {
type: "bi.vertical",
items: [{
type: "bi.absolute",
items: [{
el: this.track,
width: "100%",
height: c.TRACK_HEIGHT
}]
}],
hgap: 7,
height: c.TRACK_HEIGHT
},
top: 33,
left: 0,
width: "100%"
}, {
el: sliderVertical,
top: 30,
left: 0,
width: "100%"
}, {
el: {
type: "bi.vertical",
items: [{
type: "bi.absolute",
items: [this.label]
}],
rgap: c.EDITOR_WIDTH,
height: c.EDITOR_HEIGHT
},
top: 0,
left: 0,
width: "100%"
}]
})
},
_createTrackWrapper: function () {
return BI.createWidget({
type: "bi.absolute",
items: [{
el: {
type: "bi.vertical",
items: [{
type: "bi.absolute",
items: [{
el: this.grayTrack,
top: 0,
left: 0,
width: "100%"
}, {
el: this.blueTrack,
top: 0,
left: 0,
width: "0%"
}]
}],
hgap: 8,
height: 8
},
top: 8,
left: 0,
width: "100%"
}]
})
},
_checkValidation: function (v) {
return !(BI.isNull(v) || v < this.min || v > this.max)
},
_setBlueTrack: function (percent) {
this.blueTrack.element.css({"width": percent + "%"});
},
_setLabelPosition: function (percent) {
this.label.element.css({"left": percent + "%"});
},
_setSliderPosition: function (percent) {
this.slider.element.css({"left": percent + "%"});
},
_setAllPosition: function (percent) {
this._setSliderPosition(percent);
this._setLabelPosition(percent);
this._setBlueTrack(percent);
},
_setVisible: function (visible) {
this.slider.setVisible(visible);
this.label.setVisible(visible);
},
_getGrayTrackLength: function () {
return this.grayTrack.element[0].scrollWidth
},
_getValueByPercent: function (percent) {
var thousandth = BI.parseInt(percent * 10);
return (((this.max - this.min) * thousandth) / 1000 + this.min);
},
_getPercentByValue: function (v) {
return (v - this.min) * 100 / (this.max - this.min);
},
getValue: function () {
return this.value;
},
setValue: function (v) {
var value = BI.parseFloat(v);
if ((!isNaN(value))) {
if (this._checkValidation(value)) {
this.value = value;
}
if (value > this.max) {
this.value = this.max;
}
if (value < this.min) {
this.value = this.min;
}
}
},
setMinAndMax: function (v) {
var minNumber = BI.parseFloat(v.min);
var maxNumber = BI.parseFloat(v.max);
if ((!isNaN(minNumber)) && (!isNaN(maxNumber)) && (maxNumber > minNumber )) {
this.min = minNumber;
this.max = maxNumber;
}
},
reset: function () {
this._setVisible(false);
this.enable = false;
this.value = "";
this.min = 0;
this.max = 0;
this._setBlueTrack(0);
},
populate: function () {
if (!isNaN(this.min) && !isNaN(this.max)) {
this._setVisible(true);
this.enable = true;
this.label.setErrorText(BI.i18nText("BI-Please_Enter") + this.min + "-" + this.max + BI.i18nText("BI-Basic_De") + BI.i18nText("BI-Basic_Number"));
if (BI.isNumeric(this.value) || BI.isNotEmptyString(this.value)) {
this.label.setValue(this.value);
this._setAllPosition(this._getPercentByValue(this.value));
} else {
this.label.setValue(this.max);
this._setAllPosition(100);
}
}
}
});
BI.SingleSlider.EVENT_CHANGE = "EVENT_CHANGE";
BI.shortcut("bi.single_slider", BI.SingleSlider);/**
* normal single slider
* Created by Young on 2017/6/21.
*/
BI.SingleSliderNormal = BI.inherit(BI.Widget, {
_constant: {
EDITOR_WIDTH: 90,
EDITOR_HEIGHT: 30,
HEIGHT: 28,
SLIDER_WIDTH_HALF: 15,
SLIDER_WIDTH: 30,
SLIDER_HEIGHT: 30,
TRACK_HEIGHT: 24
},
props: {
baseCls: "bi-single-button bi-button-track",
minMax: {
min: 0,
max: 100
},
color: "#3f8ce8"
},
render: function () {
var self = this;
var c = this._constant;
var track = this._createTrack();
this.slider = BI.createWidget({
type: "bi.single_slider_slider"
});
this.slider.element.draggable({
axis: "x",
containment: this.grayTrack.element,
scroll: false,
drag: function (e, ui) {
var percent = (ui.position.left) * 100 / (self._getGrayTrackLength());
var significantPercent = BI.parseFloat(percent.toFixed(1));//直接对计算出来的百分数保留到小数点后一位，相当于分成了1000份。
self._setBlueTrack(significantPercent);
var v = self._getValueByPercent(significantPercent);
self.value = v;
self.fireEvent(BI.SingleSliderNormal.EVENT_DRAG, v);
},
stop: function (e, ui) {
var percent = (ui.position.left) * 100 / (self._getGrayTrackLength());
var significantPercent = BI.parseFloat(percent.toFixed(1));
self._setSliderPosition(significantPercent);
self.fireEvent(BI.SingleSlider.EVENT_CHANGE);
}
});
var sliderVertical = BI.createWidget({
type: "bi.vertical",
items: [{
type: "bi.absolute",
items: [this.slider]
}],
hgap: c.SLIDER_WIDTH_HALF,
height: c.SLIDER_HEIGHT
});
sliderVertical.element.click(function (e) {
if (self.enable) {
var offset = e.clientX - self.element.offset().left - c.SLIDER_WIDTH_HALF;
var trackLength = self.track.element[0].scrollWidth;
var percent = 0;
if (offset < 0) {
percent = 0
}
if (offset > 0 && offset < (trackLength - c.SLIDER_WIDTH)) {
percent = offset * 100 / self._getGrayTrackLength();
}
if (offset > (trackLength - c.SLIDER_WIDTH)) {
percent = 100
}
var significantPercent = BI.parseFloat(percent.toFixed(1));
self._setAllPosition(significantPercent);
var v = self._getValueByPercent(significantPercent);
self.value = v;
self.fireEvent(BI.SingleSlider.EVENT_CHANGE);
}
});
return {
type: "bi.absolute",
element: this,
items: [{
el: {
type: "bi.vertical",
items: [{
type: "bi.absolute",
items: [{
el: track,
width: "100%",
height: c.TRACK_HEIGHT
}]
}],
hgap: 7,
height: c.TRACK_HEIGHT
},
top: 3,
left: 0,
width: "100%"
}, {
el: sliderVertical,
top: 0,
left: 0,
width: "100%"
}]
}
},
_createTrack: function () {
var self = this;
var c = this._constant;
this.grayTrack = BI.createWidget({
type: "bi.layout",
cls: "gray-track",
height: 6
});
this.blueTrack = BI.createWidget({
type: "bi.layout",
cls: "blue-track",
height: 6
});
this.blueTrack.element.css({"background-color": this.options.color});
return {
type: "bi.absolute",
items: [{
el: {
type: "bi.vertical",
items: [{
type: "bi.absolute",
items: [{
el: this.grayTrack,
top: 0,
left: 0,
width: "100%"
}, {
el: this.blueTrack,
top: 0,
left: 0,
width: "0%"
}]
}],
hgap: 8,
height: 8
},
top: 8,
left: 0,
width: "100%"
}],
ref: function (ref) {
self.track = ref;
}
}
},
_checkValidation: function (v) {
return !(BI.isNull(v) || v < this.min || v > this.max)
},
_setBlueTrack: function (percent) {
this.blueTrack.element.css({"width": percent + "%"});
},
_setSliderPosition: function (percent) {
this.slider.element.css({"left": percent + "%"});
},
_setAllPosition: function (percent) {
this._setSliderPosition(percent);
this._setBlueTrack(percent);
},
_setVisible: function (visible) {
this.slider.setVisible(visible);
},
_getGrayTrackLength: function () {
return this.grayTrack.element[0].scrollWidth
},
_getValueByPercent: function (percent) {
var thousandth = BI.parseInt(percent * 10);
return (((this.max - this.min) * thousandth) / 1000 + this.min);
},
_getPercentByValue: function (v) {
return (v - this.min) * 100 / (this.max - this.min);
},
getValue: function () {
return this.value;
},
setValue: function (v) {
var value = BI.parseFloat(v);
if ((!isNaN(value))) {
if (this._checkValidation(value)) {
this.value = value;
}
if (value > this.max) {
this.value = this.max;
}
if (value < this.min) {
this.value = this.min;
}
}
},
setMinAndMax: function (v) {
var minNumber = BI.parseFloat(v.min);
var maxNumber = BI.parseFloat(v.max);
if ((!isNaN(minNumber)) && (!isNaN(maxNumber)) && (maxNumber > minNumber )) {
this.min = minNumber;
this.max = maxNumber;
}
},
reset: function () {
this._setVisible(false);
this.enable = false;
this.value = "";
this.min = 0;
this.max = 0;
this._setBlueTrack(0);
},
populate: function () {
if (!isNaN(this.min) && !isNaN(this.max)) {
this._setVisible(true);
this.enable = true;
if (BI.isNumeric(this.value) || BI.isNotEmptyString(this.value)) {
this._setAllPosition(this._getPercentByValue(this.value));
} else {
this._setAllPosition(100);
}
}
}
});
BI.SingleSliderNormal.EVENT_DRAG = "EVENT_DRAG";
BI.shortcut("bi.single_slider_normal", BI.SingleSliderNormal);/**
* Created by Urthur on 2017/9/4.
*/
BI.SliderButton = BI.inherit(BI.Widget, {
_defaultConfig: function () {
return BI.extend(BI.SliderButton.superclass._defaultConfig.apply(this, arguments), {
baseCls: "bi-slider-button"
});
},
_init: function () {
BI.extend(BI.SliderButton.superclass._init.apply(this, arguments));
var self = this;
var sliderButton = BI.createWidget({
type: "bi.icon_button",
cls: "column-next-page-h-font",
iconWidth: 16,
iconHeight: 16,
height: 16,
width: 16
});
BI.createWidget({
type: "bi.absolute",
element: this,
items: [{
el: sliderButton,
left: -8
}, {
el: {
type: "bi.label",
ref: function (_ref) {
self.label = _ref;
}
},
left: -8,
top: -10
}]
});
},
setValue: function (v) {
this.label.setText(v);
}
});
BI.shortcut("bi.slider_button", BI.SliderButton);/**
* Created by Urthur on 2017/9/4.
*/
BI.SliderNormal = BI.inherit(BI.Widget, {
_constant: {
HEIGHT: 28,
SLIDER_WIDTH_HALF: 10,
SLIDER_WIDTH: 25,
SLIDER_HEIGHT: 30,
TRACK_HEIGHT: 24
},
_defaultConfig: function () {
return BI.extend(BI.SliderNormal.superclass._defaultConfig.apply(this, arguments), {
baseCls: "bi-slider",
min: 10,
max: 50
})
},
_init: function () {
BI.SliderNormal.superclass._init.apply(this, arguments);
var self = this;
var c = this._constant, o = this.options;
this.enable = false;
this.value = o.min;
this.min = o.min;
this.max = o.max;
this.rightTrack = BI.createWidget({
type: "bi.layout",
cls: "bi-slider-track",
height: 5
});
this.track = this._createTrack();
this.slider = BI.createWidget({
type: "bi.slider_button"
});
this.slider.setValue(this.getValue());
this.slider.element.draggable({
axis: "x",
containment: this.rightTrack.element,
scroll: false,
drag: function (e, ui) {
var percent = (ui.position.left) * 100 / (self._getRightTrackLength());
var significantPercent = BI.parseFloat(percent.toFixed(1));//直接对计算出来的百分数保留到小数点后一位，相当于分成了1000份。
var v = self._getValueByPercent(significantPercent);
self.value = BI.parseInt(v) + 1;
self.slider.setValue(self.getValue());
self.fireEvent(BI.SliderNormal.EVENT_CHANGE);
},
stop: function (e, ui) {
var percent = (ui.position.left) * 100 / (self._getRightTrackLength());
var significantPercent = BI.parseFloat(percent.toFixed(1));
self._setSliderPosition(significantPercent);
self.fireEvent(BI.SliderNormal.EVENT_CHANGE);
}
});
var sliderVertical = BI.createWidget({
type: "bi.vertical",
items: [{
type: "bi.absolute",
items: [{
el: this.slider,
top: 10
}]
}],
hgap: c.SLIDER_WIDTH_HALF,
height: c.SLIDER_HEIGHT
});
sliderVertical.element.click(function (e) {
if (self.enable) {
var offset = e.clientX - self.element.offset().left - c.SLIDER_WIDTH_HALF;
var trackLength = self.track.element[0].scrollWidth;
var percent = 0;
if (offset < 0) {
percent = 0
}
if (offset > 0 && offset < (trackLength - c.SLIDER_WIDTH)) {
percent = offset * 100 / self._getRightTrackLength();
}
if (offset > (trackLength - c.SLIDER_WIDTH)) {
percent = 100
}
var significantPercent = BI.parseFloat(percent.toFixed(1));
self._setSliderPosition(significantPercent);
var v = self._getValueByPercent(significantPercent);
self.value = BI.parseInt(v);
self.slider.setValue(self.getValue());
self.fireEvent(BI.SliderNormal.EVENT_CHANGE);
}
});
BI.createWidget({
type: "bi.absolute",
element: this,
items: [{
el: {
type: "bi.vertical",
items: [{
type: "bi.absolute",
items: [{
el: this.track,
width: "100%",
height: c.TRACK_HEIGHT
}]
}],
height: c.TRACK_HEIGHT
},
top: 33,
left: 0,
width: "100%"
}, {
el: sliderVertical,
top: 15,
left: 0,
width: "100%"
}]
});
},
_createTrack: function () {
return BI.createWidget({
type: "bi.absolute",
items: [{
el: {
type: "bi.vertical",
items: [{
type: "bi.absolute",
items: [{
el: this.rightTrack,
top: 0,
left: 0,
width: "100%"
}]
}],
hgap: 8,
height: 5
},
top: 5,
left: 0,
width: "100%"
}]
})
},
_checkValidation: function (v) {
return !(BI.isNull(v) || v < this.min || v > this.max)
},
_setSliderPosition: function (percent) {
this.slider.element.css({"left": percent + "%"});
},
_getRightTrackLength: function () {
return this.rightTrack.element[0].scrollWidth
},
_getValueByPercent: function (percent) {
var thousandth = BI.parseInt(percent * 10);
return (((this.max - this.min) * thousandth) / 1000 + this.min);
},
_getPercentByValue: function (v) {
return (v - this.min) * 100 / (this.max - this.min);
},
getValue: function () {
return this.value;
},
setValue: function (v) {
var value = BI.parseFloat(v);
if ((!isNaN(value))) {
if (this._checkValidation(value)) {
this.value = value;
}
if (value > this.max) {
this.value = this.max;
}
if (value < this.min) {
this.value = this.min;
}
}
if (!isNaN(this.min) && !isNaN(this.max)) {
this.enable = true;
if (BI.isNumeric(this.value) || BI.isNotEmptyString(this.value)) {
this.slider.setValue(BI.parseInt(this.value));
this._setSliderPosition(this._getPercentByValue(this.value));
} else {
this.slider.setValue(this.max);
this._setSliderPosition(100);
}
}
}
});
BI.SliderNormal.EVENT_CHANGE = "EVENT_CHANGE";
BI.shortcut("bi.slider", BI.SliderNormal);/**
* 可以单选多选切换的树 * 可以单选多选切换的树
* *
* Created by GUY on 2015/12/21. * Created by GUY on 2015/12/21.

0
src/widget/slider/singleslider/button/iconbutton.slider.js → src/addons/slider/slider/singleslider/button/iconbutton.slider.js
Unescape View File

0
src/widget/slider/singleslider/singleslider.js → src/addons/slider/slider/singleslider/singleslider.js
Unescape View File

0
src/widget/slider/singleslider/singleslider.normal.js → src/addons/slider/slider/singleslider/singleslider.normal.js
Unescape View File

0
src/widget/slider/slider.button.js → src/addons/slider/slider/slider.button.js
Unescape View File

0
src/widget/slider/slider.js → src/addons/slider/slider/slider.js
Unescape View File

Write Preview
Loading…
Cancel
Save