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

KERNEL-13928 refactor: es6化0.single.js

es6
impact 2 years ago
parent
ff266d9864
commit
a10539682f
2 changed files with 118 additions and 112 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. 3
      src/base/index.js
  2. 221
      src/base/single/0.single.js

3
src/base/index.js
Unescape View File

@ -1,9 +1,12 @@
import Pane from "./1.pane"; import Pane from "./1.pane";
import Single from "./single/0.single";
BI.extend(BI, { BI.extend(BI, {
Pane, Pane,
Single,
}); });
export { export {
Pane, Pane,
Single,
} }

221
src/base/single/0.single.js
Unescape View File

@ -10,11 +10,16 @@
* @abstract * @abstract
*/ */
var delayingTooltips; import { Widget, shortcut } from "../../core";
import BI from "../../core/2.base";
import { Tooltips } from "../0.base";
BI.Single = BI.inherit(BI.Widget, { @shortcut()
_defaultConfig: function () { export default class Single extends Widget {
var conf = BI.Single.superclass._defaultConfig.apply(this, arguments); static xtype = "bi.single";
_defaultConfig() {
const conf = super._defaultConfig(arguments);
return BI.extend(conf, { return BI.extend(conf, {
readonly: false, readonly: false,
@ -24,13 +29,22 @@ BI.Single = BI.inherit(BI.Widget, {
belowMouse: false, // title是否跟随鼠标 belowMouse: false, // title是否跟随鼠标
enableHover: false, enableHover: false,
}); });
}, }
_showToolTip: function (e, opt) { _showToolTip(e, opt) {
opt || (opt = {}); opt || (opt = {});
var self = this; const { action } = this.options;
var o = this.options; const title = this.getTitle();
var title = this.getTitle();
const showToolTip = (tooltipOpt) => {
if (BI.isKey(tooltipOpt.text) && !Tooltips.has(this.getName())) {
Tooltips.show(e, this.getName(), tooltipOpt, this, opt);
if (action) {
BI.Actions.runAction(action, "hover", this.options, this);
}
BI.Actions.runGlobalAction("hover", this.options, this);
}
}
if (title instanceof Promise) { if (title instanceof Promise) {
this.requestingTitle = title; this.requestingTitle = title;
@ -42,47 +56,37 @@ BI.Single = BI.inherit(BI.Widget, {
showToolTip(this._getTooltipOptions(title)); showToolTip(this._getTooltipOptions(title));
} }
function showToolTip(tooltipOpt) {
if (BI.isKey(tooltipOpt.text) && !BI.Tooltips.has(self.getName())) {
BI.Tooltips.show(e, self.getName(), tooltipOpt, self, opt);
if (o.action) {
BI.Actions.runAction(o.action, "hover", o, self);
}
BI.Actions.runGlobalAction("hover", o, self);
} }
}
},
_hideTooltip: function () { _hideTooltip() {
var self = this; const tooltip = Tooltips.get(this.getName());
var tooltip = BI.Tooltips.get(this.getName());
if (BI.isNotNull(tooltip)) { if (BI.isNotNull(tooltip)) {
tooltip.element.fadeOut(200, function () { tooltip.element.fadeOut(200, () => {
BI.Tooltips.remove(self.getName()); Tooltips.remove(this.getName());
}); });
} }
}, }
_init: function () { _init() {
var self = this, o = this.options; let { value } = this.options;
o.value = BI.isFunction(o.value) ? this.__watch(o.value, function (context, newValue) { value = BI.isFunction(value) ? this.__watch(value, (context, newValue) => {
self.setValue(newValue); this.setValue(newValue);
}) : o.value; }) : value;
BI.Single.superclass._init.apply(this, arguments); super._init(arguments);
}, }
_mounted: function () { _mounted() {
var o = this.options; const { enableHover, title, warningTitle, belowMouse, container } = this.options;
if (o.enableHover || BI.isKey(o.title) || BI.isKey(o.warningTitle) if (enableHover || BI.isKey(title) || BI.isKey(warningTitle)
|| BI.isFunction(o.title) || BI.isFunction(o.warningTitle)) { || BI.isFunction(title) || BI.isFunction(warningTitle)) {
this.enableHover({ this.enableHover({
belowMouse: o.belowMouse, belowMouse,
container: o.container, container,
}); });
} }
}, }
_clearTimeOut: function () { _clearTimeOut() {
if (BI.isNotNull(this.showTimeout)) { if (BI.isNotNull(this.showTimeout)) {
clearTimeout(this.showTimeout); clearTimeout(this.showTimeout);
this.showTimeout = null; this.showTimeout = null;
@ -91,88 +95,88 @@ BI.Single = BI.inherit(BI.Widget, {
clearTimeout(this.hideTimeout); clearTimeout(this.hideTimeout);
this.hideTimeout = null; this.hideTimeout = null;
} }
}, }
_getTooltipOptions: function (title) { _getTooltipOptions(title) {
var o = this.options; const { tipType } = this.options;
var tooltipOpt = {}; let tooltipOpt = {};
if (BI.isPlainObject(title)) { if (BI.isPlainObject(title)) {
tooltipOpt = title; tooltipOpt = title;
} else { } else {
tooltipOpt.level = this.getTipType() || "success"; tooltipOpt.level = this.getTipType() || "success";
// 由于以前的用法,存在大量disabled:true搭配warningTitle的情况,所以这里做一个兼容,disabled:true的情况下,依然优先显示warningTitle,避免只设置了warningTitle而没有设置title的情况 // 由于以前的用法,存在大量disabled:true搭配warningTitle的情况,所以这里做一个兼容,disabled:true的情况下,依然优先显示warningTitle,避免只设置了warningTitle而没有设置title的情况
if (BI.isNull(o.tipType) && !this.isEnabled()) { if (BI.isNull(tipType) && !this.isEnabled()) {
tooltipOpt.text = (this.getWarningTitle() || title); tooltipOpt.text = (this.getWarningTitle() || title);
} else { } else {
tooltipOpt.text = tooltipOpt.level === "success" ? title : (this.getWarningTitle() || title); tooltipOpt.text = tooltipOpt.level === "success" ? title : (this.getWarningTitle() || title);
} }
} }
return tooltipOpt; return tooltipOpt;
}, }
enableHover: function (opt) { enableHover(opt) {
opt || (opt = {}); opt || (opt = {});
var self = this; let delayingTooltips;
if (!this._hoverBinded) { if (!this._hoverBinded) {
this.element.unbind("mouseenter.title").on("mouseenter.title", function (e) { this.element.unbind("mouseenter.title").on("mouseenter.title", (e) => {
self._e = e; this._e = e;
self.mouseOver = true; this.mouseOver = true;
if (self.getTipType() === "warning" || (BI.isKey(self.getWarningTitle()) && !self.isEnabled())) { if (this.getTipType() === "warning" || (BI.isKey(this.getWarningTitle()) && !this.isEnabled())) {
delayingTooltips = self.getName(); delayingTooltips = this.getName();
self.showTimeout = BI.delay(function () { this.showTimeout = BI.delay(() => {
if (BI.isNotNull(self.showTimeout) && delayingTooltips === self.getName()) { if (BI.isNotNull(this.showTimeout) && delayingTooltips === this.getName()) {
self._showToolTip(self._e || e, opt); this._showToolTip(this._e || e, opt);
} }
}, 200); }, 200);
} else if (self.getTipType() === "success" || self.isEnabled()) { } else if (this.getTipType() === "success" || this.isEnabled()) {
delayingTooltips = self.getName(); delayingTooltips = this.getName();
self.showTimeout = BI.delay(function () { this.showTimeout = BI.delay(() => {
if (BI.isNotNull(self.showTimeout) && delayingTooltips === self.getName()) { if (BI.isNotNull(this.showTimeout) && delayingTooltips === this.getName()) {
self._showToolTip(self._e || e, opt); this._showToolTip(this._e || e, opt);
} }
}, 500); }, 500);
} }
}); });
this.element.unbind("mousemove.title").on("mousemove.title", function (e) { this.element.unbind("mousemove.title").on("mousemove.title", (e) => {
self._e = e; this._e = e;
if (BI.isNotNull(self.showTimeout)) { if (BI.isNotNull(this.showTimeout)) {
clearTimeout(self.showTimeout); clearTimeout(this.showTimeout);
self.showTimeout = null; this.showTimeout = null;
} }
if (BI.isNull(self.hideTimeout)) { if (BI.isNull(this.hideTimeout)) {
self.hideTimeout = BI.delay(function () { this.hideTimeout = BI.delay(() => {
if (BI.isNotNull(self.hideTimeout)) { if (BI.isNotNull(this.hideTimeout)) {
self._hideTooltip(); this._hideTooltip();
} }
}, 500); }, 500);
} }
self.showTimeout = BI.delay(function () { this.showTimeout = BI.delay(() => {
// DEC-5321 IE下如果回调已经进入事件队列，clearTimeout将不会起作用 // DEC-5321 IE下如果回调已经进入事件队列，clearTimeout将不会起作用
if (BI.isNotNull(self.showTimeout)) { if (BI.isNotNull(this.showTimeout)) {
if (BI.isNotNull(self.hideTimeout)) { if (BI.isNotNull(this.hideTimeout)) {
clearTimeout(self.hideTimeout); clearTimeout(this.hideTimeout);
self.hideTimeout = null; this.hideTimeout = null;
} }
// CHART-10611 在拖拽的情况下, 鼠标拖拽着元素离开了拖拽元素的容器，但是子元素在dom结构上仍然属于容器 // CHART-10611 在拖拽的情况下, 鼠标拖拽着元素离开了拖拽元素的容器，但是子元素在dom结构上仍然属于容器
// 这样会认为鼠标仍然在容器中, 500ms内放开的话，会在容器之外显示鼠标停留处显示容器的title // 这样会认为鼠标仍然在容器中, 500ms内放开的话，会在容器之外显示鼠标停留处显示容器的title
if (self.element.__isMouseInBounds__(self._e || e)) { if (this.element.__isMouseInBounds__(this._e || e)) {
self._showToolTip(self._e || e, opt); this._showToolTip(this._e || e, opt);
} }
} }
}, 500); }, 500);
}); });
this.element.unbind("mouseleave.title").on("mouseleave.title", function (e) { this.element.unbind("mouseleave.title").on("mouseleave.title", (e) => {
self._e = null; this._e = null;
self.mouseOver = false; this.mouseOver = false;
self._clearTimeOut(); this._clearTimeOut();
self._hideTooltip(); this._hideTooltip();
}); });
this._hoverBinded = true; this._hoverBinded = true;
} }
}, }
disabledHover: function () { disabledHover() {
// 取消hover事件 // 取消hover事件
this._clearTimeOut(); this._clearTimeOut();
this._hideTooltip(); this._hideTooltip();
@ -180,74 +184,73 @@ BI.Single = BI.inherit(BI.Widget, {
.unbind("mousemove.title") .unbind("mousemove.title")
.unbind("mouseleave.title"); .unbind("mouseleave.title");
this._hoverBinded = false; this._hoverBinded = false;
}, }
// opt: {container: '', belowMouse: false} // opt: {container: '', belowMouse: false}
setTitle: function (title, opt) { setTitle(title, opt) {
this.options.title = title; this.options.title = title;
if (BI.isKey(title) || BI.isFunction(title)) { if (BI.isKey(title) || BI.isFunction(title)) {
this.enableHover(opt); this.enableHover(opt);
} else { } else {
this.disabledHover(); this.disabledHover();
} }
}, }
setWarningTitle: function (title, opt) { setWarningTitle(title, opt) {
this.options.warningTitle = title; this.options.warningTitle = title;
if (BI.isKey(title) || BI.isFunction(title)) { if (BI.isKey(title) || BI.isFunction(title)) {
this.enableHover(opt); this.enableHover(opt);
} else { } else {
this.disabledHover(); this.disabledHover();
} }
}, }
setTipType: function (type) { setTipType(type) {
this.options.tipType = type; this.options.tipType = type;
}, }
getTipType: function () { getTipType() {
return this.options.tipType; return this.options.tipType;
}, }
isReadOnly: function () { isReadOnly() {
return !!this.options.readonly; return !!this.options.readonly;
}, }
getTitle: function () { getTitle() {
var title = this.options.title; const title = this.options.title;
if (BI.isFunction(title)) { if (BI.isFunction(title)) {
return title(); return title();
} }
return title; return title;
}, }
getWarningTitle: function () { getWarningTitle() {
var title = this.options.warningTitle; const title = this.options.warningTitle;
if (BI.isFunction(title)) { if (BI.isFunction(title)) {
return title(); return title();
} }
return title; return title;
}, }
setValue: function (val) { setValue(val) {
if (!this.options.readonly) { if (!this.options.readonly) {
this.options.value = val; this.options.value = val;
this.options.setValue && this.options.setValue(val); this.options.setValue && this.options.setValue(val);
} }
}, }
getValue: function () { getValue() {
return this.options.value; return this.options.value;
}, }
_destroyed: function () { _destroyed() {
if (BI.isNotNull(this.showTimeout)) { if (BI.isNotNull(this.showTimeout)) {
clearTimeout(this.showTimeout); clearTimeout(this.showTimeout);
this.showTimeout = null; this.showTimeout = null;
} }
BI.Tooltips.remove(this.getName()); Tooltips.remove(this.getName());
}, }
}); }
BI.shortcut("bi.single", BI.Single);

Write Preview
Loading…
Cancel
Save