forked from fanruan/fineui
Browse Source
Merge in VISUAL/fineui from ~ZHENFEI.LI/fineui:es6 to es6 * commit 'd393c6a05e17cb9222e1690d4f6af861c82550ca': KERNEL-14081 refactor: case/loader、segment、toolbar KERNEL-14071 refactor: case/trigger的es6化es6
Zhenfei.Li-李振飞
2 years ago
22 changed files with 993 additions and 888 deletions
@ -0,0 +1,3 @@
|
||||
export { LazyLoader } from "./loader.lazy"; |
||||
export { ListLoader } from "./loader.list"; |
||||
export { SortList } from "./sort.list"; |
||||
@ -1,103 +1,106 @@
|
||||
/** |
||||
* Created by roy on 15/11/6. |
||||
*/ |
||||
BI.LazyLoader = BI.inherit(BI.Widget, { |
||||
_const: { |
||||
PAGE: 100 |
||||
}, |
||||
_defaultConfig: function () { |
||||
return BI.extend(BI.LazyLoader.superclass._defaultConfig.apply(this, arguments), { |
||||
import { shortcut, Widget, extend, createWidget, takeRight, take } from "@/core"; |
||||
import { Loader } from "@/base"; |
||||
|
||||
@shortcut() |
||||
export class LazyLoader extends Widget { |
||||
static xtype = "bi.lazy_loader" |
||||
|
||||
_const = { |
||||
PAGE: 100, |
||||
}; |
||||
|
||||
static EVENT_CHANGE = "EVENT_CHANGE" |
||||
|
||||
_defaultConfig() { |
||||
return extend(super._defaultConfig(...arguments), { |
||||
baseCls: "bi-lazy-loader", |
||||
el: {}, |
||||
items: [] |
||||
items: [], |
||||
}); |
||||
}, |
||||
} |
||||
|
||||
_init: function () { |
||||
var self = this, o = this.options; |
||||
BI.LazyLoader.superclass._init.apply(this, arguments); |
||||
var all = o.items.length; |
||||
this.loader = BI.createWidget({ |
||||
_init() { |
||||
const o = this.options; |
||||
super._init(...arguments); |
||||
const all = o.items.length; |
||||
this.loader = createWidget({ |
||||
type: "bi.loader", |
||||
element: this, |
||||
// 下面是button_group的属性
|
||||
el: o.el, |
||||
|
||||
itemsCreator: function (options, populate) { |
||||
populate(self._getNextItems(options)); |
||||
itemsCreator: (options, populate) => { |
||||
populate(this._getNextItems(options)); |
||||
}, |
||||
hasNext: function (option) { |
||||
return option.count < all; |
||||
} |
||||
hasNext: option => option.count < all, |
||||
}); |
||||
|
||||
this.loader.on(BI.Loader.EVENT_CHANGE, function (obj) { |
||||
self.fireEvent(BI.LazyLoader.EVENT_CHANGE, obj); |
||||
this.loader.on(Loader.EVENT_CHANGE, obj => { |
||||
this.fireEvent(LazyLoader.EVENT_CHANGE, obj); |
||||
}); |
||||
}, |
||||
_getNextItems: function (options) { |
||||
var self = this, o = this.options; |
||||
var lastNum = o.items.length - this._const.PAGE * (options.times - 1); |
||||
var lastItems = BI.takeRight(o.items, lastNum); |
||||
var nextItems = BI.take(lastItems, this._const.PAGE); |
||||
} |
||||
|
||||
_getNextItems(options) { |
||||
const o = this.options; |
||||
const lastNum = o.items.length - this._const.PAGE * (options.times - 1); |
||||
const lastItems = takeRight(o.items, lastNum); |
||||
const nextItems = take(lastItems, this._const.PAGE); |
||||
|
||||
return nextItems; |
||||
}, |
||||
} |
||||
|
||||
populate: function (items) { |
||||
populate(items) { |
||||
this.loader.populate(items); |
||||
}, |
||||
} |
||||
|
||||
addItems: function (items) { |
||||
addItems(items) { |
||||
this.loader.addItems(items); |
||||
}, |
||||
} |
||||
|
||||
empty: function () { |
||||
empty() { |
||||
this.loader.empty(); |
||||
}, |
||||
} |
||||
|
||||
setNotSelectedValue: function () { |
||||
this.loader.setNotSelectedValue.apply(this.loader, arguments); |
||||
}, |
||||
setNotSelectedValue() { |
||||
this.loader.setNotSelectedValue(...arguments); |
||||
} |
||||
|
||||
getNotSelectedValue: function () { |
||||
getNotSelectedValue() { |
||||
return this.loader.getNotSelectedValue(); |
||||
}, |
||||
} |
||||
|
||||
setValue: function () { |
||||
this.loader.setValue.apply(this.loader, arguments); |
||||
}, |
||||
setValue() { |
||||
this.loader.setValue(...arguments); |
||||
} |
||||
|
||||
getValue: function () { |
||||
return this.loader.getValue.apply(this.loader, arguments); |
||||
}, |
||||
getValue() { |
||||
return this.loader.getValue(...arguments); |
||||
} |
||||
|
||||
getAllButtons: function () { |
||||
getAllButtons() { |
||||
return this.loader.getAllButtons(); |
||||
}, |
||||
} |
||||
|
||||
getAllLeaves: function () { |
||||
getAllLeaves() { |
||||
return this.loader.getAllLeaves(); |
||||
}, |
||||
} |
||||
|
||||
getSelectedButtons: function () { |
||||
getSelectedButtons() { |
||||
return this.loader.getSelectedButtons(); |
||||
}, |
||||
} |
||||
|
||||
getNotSelectedButtons: function () { |
||||
getNotSelectedButtons() { |
||||
return this.loader.getNotSelectedButtons(); |
||||
}, |
||||
} |
||||
|
||||
getIndexByValue: function (value) { |
||||
getIndexByValue(value) { |
||||
return this.loader.getIndexByValue(value); |
||||
}, |
||||
} |
||||
|
||||
getNodeById: function (id) { |
||||
getNodeById(id) { |
||||
return this.loader.getNodeById(id); |
||||
}, |
||||
} |
||||
|
||||
getNodeByValue: function (value) { |
||||
getNodeByValue(value) { |
||||
return this.loader.getNodeByValue(value); |
||||
} |
||||
}); |
||||
BI.LazyLoader.EVENT_CHANGE = "EVENT_CHANGE"; |
||||
BI.shortcut("bi.lazy_loader", BI.LazyLoader); |
||||
} |
||||
|
||||
@ -1,43 +1,48 @@
|
||||
import { shortcut, extend, createWidget } from "@/core"; |
||||
import { BasicButton } from "@/base"; |
||||
|
||||
/** |
||||
* 分段控件使用的button |
||||
* |
||||
* Created by GUY on 2015/9/7. |
||||
* @class BI.SegmentButton |
||||
* @extends BI.BasicButton |
||||
* @class SegmentButton |
||||
* @extends BasicButton |
||||
*/ |
||||
BI.SegmentButton = BI.inherit(BI.BasicButton, { |
||||
@shortcut() |
||||
export class SegmentButton extends BasicButton { |
||||
static xtype = "bi.segment_button" |
||||
|
||||
_defaultConfig: function () { |
||||
var conf = BI.SegmentButton.superclass._defaultConfig.apply(this, arguments); |
||||
return BI.extend(conf, { |
||||
baseCls: (conf.baseCls || "") + " bi-segment-button bi-list-item-select bi-card", |
||||
_defaultConfig() { |
||||
const conf = super._defaultConfig(...arguments); |
||||
|
||||
return extend(conf, { |
||||
baseCls: `${conf.baseCls || ""} bi-segment-button bi-list-item-select bi-card`, |
||||
shadow: true, |
||||
readonly: true, |
||||
hgap: 5 |
||||
hgap: 5, |
||||
}); |
||||
}, |
||||
} |
||||
|
||||
_init: function () { |
||||
BI.SegmentButton.superclass._init.apply(this, arguments); |
||||
var opts = this.options, self = this; |
||||
this.text = BI.createWidget({ |
||||
_init() { |
||||
super._init(...arguments); |
||||
const opts = this.options; |
||||
this.text = createWidget({ |
||||
type: "bi.label", |
||||
element: this, |
||||
textHeight: opts.height, |
||||
whiteSpace: opts.whiteSpace, |
||||
text: opts.text, |
||||
value: opts.value, |
||||
hgap: opts.hgap |
||||
hgap: opts.hgap, |
||||
}); |
||||
}, |
||||
} |
||||
|
||||
setSelected: function () { |
||||
BI.SegmentButton.superclass.setSelected.apply(this, arguments); |
||||
}, |
||||
setSelected() { |
||||
super.setSelected(...arguments); |
||||
} |
||||
|
||||
setText: function (text) { |
||||
BI.SegmentButton.superclass.setText.apply(this, arguments); |
||||
setText(text) { |
||||
super.setText(...arguments); |
||||
this.text.setText(text); |
||||
} |
||||
}); |
||||
BI.shortcut("bi.segment_button", BI.SegmentButton); |
||||
} |
||||
|
||||
@ -0,0 +1,2 @@
|
||||
export { SegmentButton } from "./button.segment"; |
||||
export { Segment } from "./segment"; |
||||
@ -1,72 +1,79 @@
|
||||
import { shortcut, Widget, extend, toPix, Controller, createWidget, createItems, makeArrayByArray } from "@/core"; |
||||
import { ButtonGroup } from "@/base"; |
||||
|
||||
/** |
||||
* 单选按钮组 |
||||
* |
||||
* Created by GUY on 2015/9/7. |
||||
* @class BI.Segment |
||||
* @extends BI.Widget |
||||
* @class Segment |
||||
* @extends Widget |
||||
*/ |
||||
BI.Segment = BI.inherit(BI.Widget, { |
||||
_defaultConfig: function () { |
||||
return BI.extend(BI.Segment.superclass._defaultConfig.apply(this, arguments), { |
||||
@shortcut() |
||||
export class Segment extends Widget { |
||||
static xtype = "bi.segment" |
||||
|
||||
static EVENT_CHANGE = "EVENT_CHANGE" |
||||
|
||||
_defaultConfig() { |
||||
return extend(super._defaultConfig(...arguments), { |
||||
baseCls: "bi-segment", |
||||
items: [], |
||||
height: 24, |
||||
}); |
||||
}, |
||||
_init: function () { |
||||
BI.Segment.superclass._init.apply(this, arguments); |
||||
var self = this, o = this.options; |
||||
this.buttonGroup = BI.createWidget({ |
||||
} |
||||
|
||||
_init() { |
||||
super._init(...arguments); |
||||
const o = this.options; |
||||
this.buttonGroup = createWidget({ |
||||
element: this, |
||||
type: "bi.button_group", |
||||
value: o.value, |
||||
items: [BI.createItems(o.items, { |
||||
items: [createItems(o.items, { |
||||
type: "bi.segment_button", |
||||
height: BI.toPix(o.height, 2), |
||||
height: toPix(o.height, 2), |
||||
whiteSpace: o.whiteSpace, |
||||
})], |
||||
layouts: [{ |
||||
type: "bi.table", |
||||
columnSize: BI.makeArrayByArray(o.items, "fill"), |
||||
columnSize: makeArrayByArray(o.items, "fill"), |
||||
}], |
||||
}); |
||||
this.buttonGroup.on(BI.Controller.EVENT_CHANGE, function () { |
||||
self.fireEvent(BI.Controller.EVENT_CHANGE, arguments); |
||||
this.buttonGroup.on(Controller.EVENT_CHANGE, (...args) => { |
||||
this.fireEvent(Controller.EVENT_CHANGE, ...args); |
||||
}); |
||||
this.buttonGroup.on(BI.ButtonGroup.EVENT_CHANGE, function (value, obj) { |
||||
self.fireEvent(BI.Segment.EVENT_CHANGE, value, obj); |
||||
this.buttonGroup.on(ButtonGroup.EVENT_CHANGE, (value, obj) => { |
||||
this.fireEvent(Segment.EVENT_CHANGE, value, obj); |
||||
}); |
||||
}, |
||||
} |
||||
|
||||
_setEnable: function (enable) { |
||||
BI.Segment.superclass._setEnable.apply(this, arguments); |
||||
_setEnable(enable) { |
||||
super._setEnable(...arguments); |
||||
if (enable === true) { |
||||
this.element.removeClass("base-disabled disabled"); |
||||
} else if (enable === false) { |
||||
this.element.addClass("base-disabled disabled"); |
||||
} |
||||
}, |
||||
} |
||||
|
||||
setValue: function (v) { |
||||
setValue(v) { |
||||
this.buttonGroup.setValue(v); |
||||
}, |
||||
} |
||||
|
||||
setEnabledValue: function (v) { |
||||
setEnabledValue(v) { |
||||
this.buttonGroup.setEnabledValue(v); |
||||
}, |
||||
} |
||||
|
||||
getValue: function () { |
||||
getValue() { |
||||
return this.buttonGroup.getValue(); |
||||
}, |
||||
} |
||||
|
||||
populate: function (buttons) { |
||||
var o = this.options; |
||||
this.buttonGroup.populate([BI.createItems(buttons, { |
||||
populate(buttons) { |
||||
const o = this.options; |
||||
this.buttonGroup.populate([createItems(buttons, { |
||||
type: "bi.segment_button", |
||||
height: BI.toPix(o.height, 2), |
||||
height: toPix(o.height, 2), |
||||
whiteSpace: o.whiteSpace, |
||||
})]); |
||||
}, |
||||
}); |
||||
BI.Segment.EVENT_CHANGE = "EVENT_CHANGE"; |
||||
BI.shortcut("bi.segment", BI.Segment); |
||||
} |
||||
} |
||||
|
||||
@ -0,0 +1,8 @@
|
||||
export { EditorTrigger } from "./trigger.editor"; |
||||
export { IconTrigger } from "./trigger.icon"; |
||||
export { IconTextTrigger } from "./trigger.icon.text"; |
||||
export { SelectIconTextTrigger } from "./trigger.icon.text.select"; |
||||
export { TextTrigger } from "./trigger.text"; |
||||
export { SelectTextTrigger } from "./trigger.text.select"; |
||||
export { SmallSelectTextTrigger } from "./trigger.text.select.small"; |
||||
export { SmallTextTrigger } from "./trigger.text.small"; |
||||
@ -1,93 +1,98 @@
|
||||
import { shortcut, extend, emptyFn, createWidget, toPix, Controller } from "@/core"; |
||||
import { Trigger } from "@/base"; |
||||
import { SignEditor } from "../editor"; |
||||
|
||||
/** |
||||
* 文本输入框trigger |
||||
* |
||||
* Created by GUY on 2015/9/15. |
||||
* @class BI.EditorTrigger |
||||
* @extends BI.Trigger |
||||
* @class EditorTrigger |
||||
* @extends Trigger |
||||
*/ |
||||
BI.EditorTrigger = BI.inherit(BI.Trigger, { |
||||
_defaultConfig: function (config) { |
||||
var conf = BI.EditorTrigger.superclass._defaultConfig.apply(this, arguments); |
||||
return BI.extend(conf, { |
||||
baseCls: (conf.baseCls || "") + " bi-editor-trigger bi-border-radius " + (config.simple ? "bi-border-bottom" : "bi-border"), |
||||
@shortcut() |
||||
export class EditorTrigger extends Trigger { |
||||
static xtype = "bi.editor_trigger"; |
||||
static EVENT_CHANGE = "EVENT_CHANGE"; |
||||
static EVENT_FOCUS = "EVENT_FOCUS"; |
||||
static EVENT_EMPTY = "EVENT_EMPTY"; |
||||
static EVENT_VALID = "EVENT_VALID"; |
||||
static EVENT_ERROR = "EVENT_ERROR"; |
||||
|
||||
_defaultConfig(config) { |
||||
const conf = super._defaultConfig(...arguments); |
||||
|
||||
return extend(conf, { |
||||
baseCls: `${conf.baseCls || ""} bi-editor-trigger bi-border-radius ${config.simple ? "bi-border-bottom" : "bi-border"}`, |
||||
height: 24, |
||||
validationChecker: BI.emptyFn, |
||||
quitChecker: BI.emptyFn, |
||||
validationChecker: emptyFn, |
||||
quitChecker: emptyFn, |
||||
allowBlank: false, |
||||
watermark: "", |
||||
errorText: "" |
||||
errorText: "", |
||||
}); |
||||
}, |
||||
} |
||||
|
||||
_init: function () { |
||||
BI.EditorTrigger.superclass._init.apply(this, arguments); |
||||
var self = this, o = this.options, c = this._const; |
||||
this.editor = BI.createWidget({ |
||||
_init() { |
||||
super._init(...arguments); |
||||
const o = this.options; |
||||
this.editor = createWidget({ |
||||
type: "bi.sign_editor", |
||||
height: BI.toPix(o.height, 2), |
||||
height: toPix(o.height, 2), |
||||
value: o.value, |
||||
validationChecker: o.validationChecker, |
||||
quitChecker: o.quitChecker, |
||||
allowBlank: o.allowBlank, |
||||
watermark: o.watermark, |
||||
errorText: o.errorText, |
||||
title: function () { |
||||
return self.getValue(); |
||||
} |
||||
title: () => this.getValue(), |
||||
}); |
||||
this.editor.on(BI.Controller.EVENT_CHANGE, function () { |
||||
self.fireEvent(BI.Controller.EVENT_CHANGE, arguments); |
||||
this.editor.on(Controller.EVENT_CHANGE, (...args) => { |
||||
this.fireEvent(Controller.EVENT_CHANGE, ...args); |
||||
}); |
||||
this.editor.on(BI.SignEditor.EVENT_CHANGE, function () { |
||||
self.fireEvent(BI.EditorTrigger.EVENT_CHANGE, arguments); |
||||
this.editor.on(SignEditor.EVENT_CHANGE, (...args) => { |
||||
this.fireEvent(EditorTrigger.EVENT_CHANGE, ...args); |
||||
}); |
||||
this.editor.on(BI.SignEditor.EVENT_FOCUS, function () { |
||||
self.fireEvent(BI.EditorTrigger.EVENT_FOCUS, arguments); |
||||
this.editor.on(SignEditor.EVENT_FOCUS, (...args) => { |
||||
this.fireEvent(EditorTrigger.EVENT_FOCUS, ...args); |
||||
}); |
||||
this.editor.on(BI.SignEditor.EVENT_EMPTY, function () { |
||||
self.fireEvent(BI.EditorTrigger.EVENT_EMPTY, arguments); |
||||
this.editor.on(SignEditor.EVENT_EMPTY, (...args) => { |
||||
this.fireEvent(EditorTrigger.EVENT_EMPTY, ...args); |
||||
}); |
||||
this.editor.on(BI.SignEditor.EVENT_VALID, function () { |
||||
self.fireEvent(BI.EditorTrigger.EVENT_VALID, arguments); |
||||
this.editor.on(SignEditor.EVENT_VALID, (...args) => { |
||||
this.fireEvent(EditorTrigger.EVENT_VALID, ...args); |
||||
}); |
||||
this.editor.on(BI.SignEditor.EVENT_ERROR, function () { |
||||
self.fireEvent(BI.EditorTrigger.EVENT_ERROR, arguments); |
||||
this.editor.on(SignEditor.EVENT_ERROR, (...args) => { |
||||
this.fireEvent(EditorTrigger.EVENT_ERROR, ...args); |
||||
}); |
||||
|
||||
BI.createWidget({ |
||||
createWidget({ |
||||
element: this, |
||||
type: "bi.horizontal_fill", |
||||
height: BI.toPix(o.height, 2), |
||||
height: toPix(o.height, 2), |
||||
items: [ |
||||
{ |
||||
el: this.editor, |
||||
width: "fill" |
||||
width: "fill", |
||||
}, { |
||||
el: { |
||||
type: "bi.trigger_icon_button", |
||||
width: o.triggerWidth || BI.toPix(o.height, 2) |
||||
width: o.triggerWidth || toPix(o.height, 2), |
||||
}, |
||||
width: "" |
||||
width: "", |
||||
} |
||||
] |
||||
], |
||||
}); |
||||
}, |
||||
} |
||||
|
||||
getValue: function () { |
||||
getValue() { |
||||
return this.editor.getValue(); |
||||
}, |
||||
} |
||||
|
||||
setValue: function (value) { |
||||
setValue(value) { |
||||
this.editor.setValue(value); |
||||
}, |
||||
} |
||||
|
||||
setText: function (text) { |
||||
setText(text) { |
||||
this.editor.setState(text); |
||||
} |
||||
}); |
||||
BI.EditorTrigger.EVENT_CHANGE = "EVENT_CHANGE"; |
||||
BI.EditorTrigger.EVENT_FOCUS = "EVENT_FOCUS"; |
||||
BI.EditorTrigger.EVENT_EMPTY = "EVENT_EMPTY"; |
||||
BI.EditorTrigger.EVENT_VALID = "EVENT_VALID"; |
||||
BI.EditorTrigger.EVENT_ERROR = "EVENT_ERROR"; |
||||
BI.shortcut("bi.editor_trigger", BI.EditorTrigger); |
||||
} |
||||
|
||||
@ -1,30 +1,35 @@
|
||||
import { shortcut, extend, createWidget } from "@/core"; |
||||
import { Trigger } from "@/base"; |
||||
|
||||
/** |
||||
* 图标按钮trigger |
||||
* |
||||
* Created by GUY on 2015/10/8. |
||||
* @class BI.IconTrigger |
||||
* @extends BI.Trigger |
||||
* @class IconTrigger |
||||
* @extends Trigger |
||||
*/ |
||||
BI.IconTrigger = BI.inherit(BI.Trigger, { |
||||
@shortcut() |
||||
export class IconTrigger extends Trigger { |
||||
static xtype = "bi.icon_trigger" |
||||
|
||||
_defaultConfig: function () { |
||||
return BI.extend(BI.IconTrigger.superclass._defaultConfig.apply(this, arguments), { |
||||
_defaultConfig() { |
||||
return extend(super._defaultConfig(...arguments), { |
||||
baseCls: "bi-icon-trigger", |
||||
extraCls: "pull-down-font", |
||||
el: {}, |
||||
height: 24 |
||||
height: 24, |
||||
}); |
||||
}, |
||||
_init: function () { |
||||
var o = this.options; |
||||
BI.IconTrigger.superclass._init.apply(this, arguments); |
||||
this.iconButton = BI.createWidget(o.el, { |
||||
} |
||||
|
||||
_init() { |
||||
const o = this.options; |
||||
super._init(...arguments); |
||||
this.iconButton = createWidget(o.el, { |
||||
type: "bi.trigger_icon_button", |
||||
element: this, |
||||
width: o.width, |
||||
height: o.height, |
||||
extraCls: o.extraCls |
||||
extraCls: o.extraCls, |
||||
}); |
||||
} |
||||
}); |
||||
BI.shortcut("bi.icon_trigger", BI.IconTrigger); |
||||
} |
||||
|
||||
Loading…
Reference in new issue